Question

我正在为面部识别应用程序构建一个前端，这是我第一次使用react。我很难弄清楚如何将我的一个状态变量的值与另一个状态变量的值相匹配，作为识别哪个对象来修改状态的方法。让我列出一下这个场景。

我定义的状态变量如下所示：

this.state = {current_name: '', correct: 0, people: [ {name: 'Alice', here: "Not Here"}, {name: 'Bob', here: "Not Here"}]}

字符串“current_name”每半秒更新一次，通过向外部端点发出请求来流式传输帧中的人。我还有一个更新状态的处理程序，如下所示：

  CorrectHandler(){
this.setState(prevState =>({
  correct: prevState.correct + 1
}));}

我在我的应用中触发“onclick”事件。

我希望能够做的是在我的处理程序中包含一个函数，用于通过名称的值来标识一个人，即“Bob”，并将“here”属性的状态更改为新的字符串。< / p>

似乎可能有一个非常简单的解决方案，但我太新了反应和javascript看到它。任何建议将不胜感激！

Answer 1

我说最好的方法是使用Array.map()和Object.assign()将people数组更改为具有新值的数组，如下所示：

function updateSpecificPerson(person) {
    if ( person.name === "Bob" ) {
        //it's Bob! Make a shallow copy of him with his new "here" value
        return Object.assign({}, person, { here: "somewhere" });
    }
    // it's not Bob - leave the object alone
    return person;
}

this.setState(prevState => {
    return {
       //copy over all the people, except Bob, who gets modified during copy
       people: prevState.people.map(updateSpecificPerson)
    };
});

可以直接将Bob和somewhere更改为您控制的变量。

React：如何通过匹配另一个状态变量的值来修改状态变量

1 个答案: