我正在使用react native构建一个移动的游戏,我试图检索它上面的最佳值存储以显示在屏幕上。问题是react native似乎在检索值之前渲染屏幕,然后在使用setBest()更新值时不重新渲染,因此没有显示值。以下是代码:
const navigation = useNavigation()
const [result, setResult] = useState('')
const [best, setBest] = useState('')
useEffect(() => {
const Storage = async (key,value) => {
await AsyncStorage.setItem(key,value)
}
const Retrieve = async (key) => {
const value = await AsyncStorage.getItem(key)
setBest(()=>value)
}
Retrieve('1').catch(console.error)
setResult(route.params.paramKey)
if(route.params.paramKey>best){
var aux = result.toString()
Storage('1',aux)
console.log(best)
}
}, [])
return (
<View style={styles.container}>
<View style={styles.textView}>
<Text style={styles.tituloText}>Melhor pontuação</Text>
<Text style={styles.tituloText}>{best}</Text>
<Text style={styles.tituloText}>Sua pontuação</Text>
<Text style={styles.resultText}>{result}</Text>
<View style={styles.viewBtn}>
<TouchableOpacity style={styles.viewBack} onPress={() => navigation.navigate('Modo1')}>
<Icon style={styles.iconBack} name="backward" />
</TouchableOpacity>
<TouchableOpacity style={styles.viewHome} onPress={() => navigation.dispatch(StackActions.popToTop)}>
<Icon style={styles.iconBack} name="home" />
</TouchableOpacity>
</View>
</View>
</View>
);
}
谢谢你们的帮助!我已经为此挣扎了好几天,任何帮助都将不胜感激!
2条答案
按热度按时间q5lcpyga1#
这是您检索值的方式。
另外,不要忘记添加import语句。
要设置该值,必须使用
soat7uwm2#
您可以在~useEffect()'中使用异步函数,如下所示: