我正在嘗試進行 api 呼叫以檢索一些資料：
index.js
const [companyInfo, setCompanyInfo] = useState({})
useEffect(() => {
getCompaniesInfo()
}, [])
getCompaniesInfo = async () => {
try {
const { data } = await axios({
method: 'GET',
url: `myURL/${companyID}/settings`,
headers: { Authorization: `Bearer ${user.token}` },
})
if (data) {
setCompanyInfo(data)
}
} catch (error) {
console.log(error)
}
}
return (
{componentSelected == 0 && <NewRequest companyInfo={companyInfo} />})
)}
const mapStateToProps = (state) => {
return {
companyID: state.auth.id,
user: state.auth,
}
}
export default connect(mapStateToProps)(Parent)
新請求.js
const NewRequest= ({ companyInfo }) => {
console.log('companyInfo', companyInfo.time.minuteInterval) // it should print a number, but it says Cannot read property 'minuteInterval' of undefined
return (
<DatePicker
minuteInterval={companyInfo.time.minuteInterval}
)
}
我該如何使用從父級的 api 中恢復的資訊，也可以在子級中使用？
uj5u.com熱心網友回復：
問題是 NewRequest 在第一次渲染時接收到一個空物件，你可以通過做這樣的事情來避免它
return (
{componentSelected == 0 && companyInfo?.time && <NewRequest companyInfo={companyInfo} />})
)}
我還建議您將 useState({}) 切換為 useState(undefined) 或一些默認值物件
這樣，在渲染之前檢查真實值會更容易，或者如果請求失敗，您可以有一些值可以回退
uj5u.com熱心網友回復：
這是因為NewRequest起初渲染還沒有 API 呼叫的結果。
您可以在渲染時添加另一個檢查，NewRequest以確保它僅在從 API 獲取結果時渲染。
return (
{
componentSelected == 0 && companyInfo && companyInfo.time &&
<NewRequest companyInfo={companyInfo} />
}
)
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/443811.html
標籤：反应式
上一篇：了解反應原生導航
下一篇：如何處理復選框動作-反應原生？