我在使用 React 的 API 呼叫時遇到了問題。當我直接在組件內部獲取資料時，它作業得很好，使用以下代碼：
export default function WeightFollowUp() {
const {userId} = useParams()
const [statistics, setStatistics] = useState(null)
useEffect(()=>{
async function fetchActivityData() {
try{
const response = await fetch (`http://localhost:3000/user/${userId}/activity`)
const results = await response.json()
setStatistics(results.data.sessions)
}
catch(err){
console.log(err)
}
finally{
console.log("Fetch completed")
}
}
fetchActivityData()
}, [])
然后我想從另一個檔案中匯入 fetchActivityData 函式，以便在同一個地方獲取我所有的 futur API 呼叫。所以它變成了這個代碼：
useEffect(()=>{
fetchActivityData()
}, [])
在第二個版本中，控制臺顯示如下錯誤訊息：
ReferenceError: userId is not defined
at fetchActivityData (APIcall.jsx:3:1)
是否有其他解決方案可以解決此問題，請記住，從組件中獲取資料對于該專案是強制性的。??
我試圖將 useParams 放在我的 APIcall 檔案中，但 useParams 只在組件內部作業。
謝謝你們的幫助。
uj5u.com熱心網友回復：
創建 fetchActivityData 函式時，只需傳遞兩個引數 userId 和 setStatistics，如下所示：
async function fetchActivityData(userId, setStatistics) {
try{
const response = await fetch (`http://localhost:3000/user/${userId}/activity`)
const results = await response.json()
setStatistics(results.data.sessions)
}
catch(err){
console.log(err)
}
finally{
console.log("Fetch completed")
}
}
當您呼叫 WeightFollowUp 組件時，只需傳遞引數 userId 和 setStatistics 即可更改您的狀態。
useEffect(()=>{
fetchActivityData(userId, setStatistics)
}, [])
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/451960.html
下一篇：如何存盤redux狀態