Javascript 更新页面数据

我需要你的帮助。我在更新页面上的数据时遇到问题。基本上，我有一个主页，其中有“FirstName:…”和“LastName:…”等从登录中检索的数据

登录完成后，每次启动应用程序时，您都会自动进入主页。 通过这种方式，我检索主页上的信息

问题在于，用户可以通过表单（ModifyProfile）修改此数据，一旦数据完成，它们就不会更新。 我怎样才能更新它们呢？ 多谢各位

Homepage.js

class HomepageUtente extends Component {
    constructor(props) {
        super(props);
        this.state = {

        }
    }
render() {

    const FirstName = global.utente.data.Person.FirstName;
    const LastName = global.utente.data.Person.LastName;

    return (

        <View style={style.container}>
            <View style={style.page}>
                <Icon name="user-circle" color="#64c7c0" size={70} onPress={() => Actions.yourprofile({ cf: Username } )} />

                <Text
                    style={{ textAlign: 'center', fontSize: 20, }}>{"Welcome"}
                </Text>
                <Text style={{ textAlign: 'center', fontSize: 20, color: '#64c7c0', fontWeight: 'bold' }}>
                    {FirstName} {LastName}
                </Text>
                    <Text style={{ color: '#64c7c0', paddingTop: 20 }} onPress={() => Actions.ModifyProfile({ cf: Username })} >Modify Profile</Text>}

            </View>
        </View>
    )
}
}

类HomePageUtene扩展组件{
建造师（道具）{
超级（道具）；
此.state={
}
}
render（）{
const FirstName=global.utenet.data.Person.FirstName；
const LastName=global.utenet.data.Person.LastName；
返回(
Actions.yourprofile（{cf:Username}}/>
{“欢迎”}
{FirstName}{LastName}
Actions.ModifyProfile（{cf:Username}}>ModifyProfile}
)
}
}

修改配置文件

    export default class ModificaProfilo extends Component {
  constructor(props) {
    super(props);
    this.state = {};
  }
    findUtente(cf) {
      //Search data cf in the db
      //......
  //......
    .then(response => {
      let utente = response.docs[0];
        console.log("Utente: " + utente)
        console.log("Sei qui 1")
        utente.Person.FirstName = this.state.FirstName;
        utente.Person.LastName = this.state.LastName;
          global.utente.db.localdb().put(utente);
    })
    .catch(function(err) {
      console.log(JSON.stringify(err));
    })

}

render() {
  return (
    <View style={style.container}>
      <View style={style.page}>
        <KeyboardAwareScrollView>

          <View style={style.inputContainer}>
            <TextInput
              style={style.inputs}
              placeholder="Name"
              placeholderTextColor="#64c7c0"
              keyboardType="default"
              underlineColorAndroid="grey"
              onChangeText={FirstName =>
                this.setState({ FirstName })
              }
            />
          </View>

          <View style={style.inputContainer}>
            <TextInput
              style={style.inputs}
              placeholder="Surname"
              placeholderTextColor="#64c7c0"
              keyboardType="default"
              underlineColorAndroid="grey"
              onChangeText={LastName => 
                this.setState({ LastName })}
            />
          </View>
          <View style={style.footer}>
            <TouchableOpacity
              style={[style.button, style.buttonOK]}
              onPress={() => this.findUtente(this.props.cf)}
            >
              <Text style={style.buttonTesto}>Modifica</Text>
            </TouchableOpacity>
          </View>

导出默认类ModificaProfilo扩展组件{
建造师（道具）{
超级（道具）；
this.state={}；
}
芬杜坦特（cf）{
//在数据库中搜索数据cf
//......
//......
。然后（响应=>{
设utinte=response.docs[0]；
console.log（“utete:+utete”）
控制台日志（“Sei qui 1”）
utinte.Person.FirstName=this.state.FirstName；
utete.Person.LastName=this.state.LastName；
global.utete.db.localdb（）.put（utete）；
})
.catch（函数（err）{
log（JSON.stringify（err））；
})
}
render（）{
返回(
this.setState（{FirstName}）
}
/>
this.setState（{LastName}）}
/>
this.findUtente（this.props.cf）}
>
修改

实际上，您可以这样做，但不应该这样做。让我们先解决它

Homepage.js

中的组件，我们称之为

A

ModifyProfile

中的组件，我们称之为

B

您需要引用组件

a

，然后调用

a.forceUpdate（）

。 这意味着您在

Homepage.js

中添加了

global.A=this

； 获取新数据后，在

ModifyProfile

中添加

global.A.forceUpdate（）

---

原因：React组件只有在组件的状态或道具发生更改时才会重新加载，这就是为什么需要调用

forceUpdate

使组件

A

无条件重新加载的原因

如果您通过

global.utenet.data.Person.FirstName='NewName'

更改

FirstName

，组件

A

无法检测更改事件

---

顺便说一句，您应该使用一个状态容器（如

redux

）来帮助您，而不是使用一个全局变量。您可以连接

FirstName

作为您的道具

我建议使用易于学习的方法，您可以只关注数据和流，而不必关心组件是否应该在大多数时间更新

还有一个启动程序

dvajs

，您可以快速运行它，然后执行以下操作：

---

如果我误解了你的问题，那就算了。

事实上，你可以这样做，但你不应该这样做。让我们先解决它

Homepage.js

中的组件，我们称之为

A

ModifyProfile

中的组件，我们称之为

B

您需要引用组件

a

，然后调用

a.forceUpdate（）

。 这意味着您在

Homepage.js

中添加了

global.A=this

； 获取新数据后，在

ModifyProfile

中添加

global.A.forceUpdate（）

---

原因：React组件只有在组件的状态或道具发生更改时才会重新加载，这就是为什么需要调用

forceUpdate

使组件

A

无条件重新加载的原因

如果您通过

global.utenet.data.Person.FirstName='NewName'

更改

FirstName

，组件

A

无法检测更改事件

---

顺便说一句，您应该使用一个状态容器（如

redux

）来帮助您，而不是使用一个全局变量。您可以连接

FirstName

作为您的道具

我建议使用易于学习的方法，您可以只关注数据和流，而不必关心组件是否应该在大多数时间更新

还有一个启动程序

dvajs

，您可以快速运行它，然后执行以下操作：

---

如果我误解了你的问题，那就算了。

任何人都可以帮我吗？任何人都可以帮我吗？谢谢你的帮助。当你谈论组件时，你指的是什么？好吧，那么我应该使用一个组件，并将我要更新的变量放在它上面。我想它们现在已经是你文件中的组件了。你可以把这两个文件的所有代码都放进去在这里，因为我只能看到它们的一部分。嗯，好的，我应该如何引用组件呢？我有点困惑看到了您的代码。

class HomePageUtene扩展了组件

，我认为在此之前有一个

import{component}来自“react”

。所以

HomepageUtente

是一个组件。谢谢你的帮助。当你谈论组件时，你指的是什么？好吧，那么我应该使用一个组件，并在其上添加我要更新的变量？我想它们现在已经是你文件中的组件了。你可以将两个文件的所有代码放在这里，因为我可以打开我可以看到其中的一部分。嗯，好的，我应该如何引用组件呢？我有点