所有页面上的更新后重新加载asyncStorage

Question

抱歉，我是反应原生和异步的初学者，我找不到正确答案......

我有2页Params.js和Index.js

这是Params.js的简短代码

   constructor(props) {
    super(props);
    this.state = {
        surname: '' 
    }
  }
componentWillMount() { 
    AsyncStorage.getItem("surname").then((value) => {
        this.setState({"surname": value});
    }).done();
}
setData() {
    try {
        AsyncStorage.setItem("surname", this.state.surname);
    } catch (error) {
      console.log(error)
    }
}
render () {  
        return (
            <Input onChangeText={(text) => { 
                this.setState({surname: text }) }} value={this.state.surname} 
            />                         
            <Button transparent onPress={() => this.setData()} ><Text>SAVE</Text></Button>
        )
 }

我可以使用此前面的代码保存和存储数据，但如果我回到索引页面上，数据不会更新

我在index.js上找到带有此代码的数据：

componentWillMount() { 
    AsyncStorage.getItem("surname").then((value) => {
        this.setState({"surname": value});
    }).done();
}

为什么我的州＆＃34;姓＆＃34;还没有更新？