我尝试使用 AsyncStorage 在我的应用程序中存储一些数据,但问题是每当我提交数据然后导航到第二个屏幕(应存储数据的位置)时,它都是空的。
这是我的代码
SendOrder.js
import Settlement from './Settlement';
export default class SendOrder extends React.Component {
state = {
text: '',
storedValue: '',
}
onSave = async () => {
const { text } = this.state
try {
await AsyncStorage.setItem(key, text);
Alert.alert('Saved', 'Successful');
} catch (error) {
Alert.alert('Error', 'There was an error.')
}
}
onChange = (text) => {
this.setState({ text });
}
render() {
return (
<View>
<View>
<Text>- Noter -</Text>
</View>
<View>
<TextInput
onChangeText = {this.onChange}
value = { this.state.text }>
</TextInput>
</View>
<TouchableOpacity onPress = { this.onSave }>
<Text style = { styles.addButtonText }> + </Text>
</TouchableOpacity>
</View>
);
}
}
结算.js
import SendOrder from './SendOrder';
const key = '@MyApp:key';
export default class Settlement extends React.Component {
state = {
text: '',
storedValue: '',
}
componentWillMount() {
this.onLoad();
}
onLoad = async () => {
try {
const storedValue = await AsyncStorage.getItem(key);
} catch (error) {
Alert.alert('Error', 'There was an error.')
}
}
render() {
const { storedValue, text } = this.state;
return (
<View>
<Text>{storedValue}</Text>
<View>
<TouchableOpacity onPress = {this.onLoad}>
<Text>Load Data</Text>
</TouchableOpacity>
</View>
</View>
);
}
}
最佳答案
您需要将storedValue
存储到onLoad
内的状态中,例如
onLoad = async () => {
try {
const storedValue = await AsyncStorage.getItem(key);
this.setState({ storedValue });
} catch (error) {
Alert.alert('Error', 'There was an error.')
}
}
希望这会有所帮助!
关于javascript - React Native - 使用 AsyncStorage 将数据存储在另一个屏幕中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50545571/