我正在嘗試使用異步存盤顯示資料（以陣列的形式）。控制臺記錄資料有效，但是當我將資料置于狀態并嘗試通過它進行映射以顯示時，它不會。歡迎任何幫助。謝謝！控制臺日志中的結果：["team1", "team2", "team3"]在 JSON.parse 之前，在 JSON.parse
Array [ "team1", "team2", "team3", ]之后
const [favoriteTeams, setFavoriteTeams] = useState([]);
const setStorage = async (team) => {
let teams = [];
try {
let storedTeams = await AsyncStorage.getItem('favTeams');
if (storedTeams !== null) {
teams = JSON.parse(storedTeams);
}
teams.push(team)
await AsyncStorage.setItem('favTeams', JSON.stringify(teams));
} catch (error) {
//error
}
};
const getStorage = async () => {
const teams = await AsyncStorage.getItem('favTeams')
if (teams !== null) {
setFavoriteTeams(prevState => [...prevState, ...JSON.parse(teams)])
}
}
useEffect(() => {
getStorage()
}, [])
return (
<View>
{favoriteTeams.map((item) => {(
<Text>{item}</Text> //console.log(item) works
)}
)}
</View>
)
uj5u.com熱心網友回復：
您的map回呼函式沒有回傳值，這就是為什么不顯示任何內容的原因。
您應該洗掉大括號。通過洗掉大括號，您的箭頭函式隱式回傳單個運算式。
return (
<View>
{favoriteTeams.map((item) => (
<Text>{item}</Text>
))}
</View>
)
或者，您可以保留大括號，在這種情況下，您必須明確回傳一個值。大括號的優點是可以在函式體中有多個陳述句。而沒有它們，您只能有一個運算式。
return (
<View>
{favoriteTeams.map((item) => {
return <Text>{item}</Text>
})}
</View>
)
有關詳細資訊，請參閱：箭頭函式運算式 -不帶花括號的函式體和箭頭函式
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/363047.html
標籤：javascript 数组 反应 反应原生 异步