return (
<div>
{
countries.map((country)=>
<div key={country.ccn3}>
{country.name.common}<button className="button" value={country} onClick={ChangeDisplay}>show</button>
</div>
)
}
</div>
);
}
如代碼所示：如何獲取“按鈕”的值，在我的情況下，值應該是“國家”obj，可以使用 onClick 函式“ChangeDisplay”呈現。
uj5u.com熱心網友回復：
資料屬性是一個好方法。
對于一個按鈕：
<button data-value={country} onClick={changeDisplay}>show</button>
點擊處理程式：
const changeDisplay = (e) => {
const { value } = e.target.dataset;
console.log(value);
};
uj5u.com熱心網友回復：
e.target.value您可以像處理表單欄位一樣簡單地獲取值。值需要是一個字串。
const App = () => {
const onClick = (e) => alert(e.target.value)
return (<button onClick={onClick} value="my button value">MyButton</button>)
}
ReactDOM.render(
<App />,
document.getElementById("root")
);<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"></div>如果你想傳遞一個物件。然后，您event只需將物件傳遞給函式即可。
<button onClick={()=> ChangeDisplay(country)} />
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/433898.html