每當我單擊按鈕時，我都試圖獲取單個產品詳細資訊，但是在第一次單擊時獲得了錯誤的產品詳細資訊，然后在第二次單擊時獲得了正確的產品詳細資訊
const updateProducts = async (e) => {
const singleProduct = await axios.get(
`https://middlemen-backend.herokuapp.com/api/product/${id}`
);
console.log(singleProduct);
setproductDetails(singleProduct);
setid(e.target.value);
setopenModal(true);
};
id 的狀態和單個產品的詳細資訊
const [productDetails, setproductDetails] = useState({});
const [id, setid] = useState(1);
下面是獲取單個資料的onclick按鈕
<div key={prod && prod.id}>
<button
onClick={updateProducts}
value={prod && prod.id}
>
Edit
</button>
</div>
uj5u.com熱心網友回復：
您在 axios 請求之后設定 id 狀態。您還應該只使用e.target.value作為 URL 引數：
const updateProducts = async (e) => {
const idValue = e.target.value;
setid(idValue);
const singleProduct = await axios.get(
`https://middlemen-backend.herokuapp.com/api/product/${idValue}`
);
console.log(singleProduct);
setproductDetails(singleProduct);
setopenModal(true);
};
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/399852.html
標籤：反应