Reactjs 为什么反应找不到；这"；事件内处理程序

全部：

当我尝试制作一个非常简单的组件，比如带有标签的inputbox，标签可以根据输入框的输入进行更改时，我的反应非常新

class App extends React.Component {
    constructor() {
        super();
        this.name = "World";
    }
    changeName(e){
        var nameinput = this.refs.nameinput;
        this.name = nameinput.value;
    }
    render(){
        return  (
            <div>
                <input ref="nameinput" onChange={this.changeName} />
                Hello, {this.name}!
            </div>
            );
    }
}

类应用程序扩展了React.Component{
构造函数（）{
超级（）；
this.name=“World”；
}
更改名称（e）{
var nameinput=this.refs.nameinput；
this.name=nameinput.value；
}
render（）{
返回(
你好，{this.name}！
);
}
}

当前的问题是changeName（）函数中没有对App的引用（当我打印出

this

时，它是未定义的）我想知道如何使用refs.nameinput.value之类的内容获取对该输入框的引用

---

谢谢

您需要绑定事件处理程序：

<input ref="nameinput" onChange={this.changeName.bind(this)}/>

有关此的更多详细信息，请参见此问题：

---

或者您可以在构造函数中绑定它

constructor() {
        super();
        this.name = "World";
        this.changeName = this.changeName.bind(this);
    }

---

现在它可以工作了，但我想知道为什么没有调用render函数，这是否意味着每次运行事件处理程序时都必须手动调用此.setState（）？我有点想知道我的状态数据结构是否很深，如何在setState（）中编写它？谢谢，现在它可以工作了，但我想知道为什么渲染函数没有被调用，这是否意味着每次运行事件处理程序时都必须手动调用此.setState（）？我有点想知道我的状态数据结构是否很深，我该如何在setState（）中编写它（比如.AA.BB.CC.DD.XXX.name）？您需要调用

setState

。您需要将

name

移动到组件的

state

属性中<代码>设置状态与现有状态进行浅合并，但不会合并深度嵌套的对象（但是，您可以使用

对象.分配

手动合并嵌套数据和更改）。我建议您尝试将数据平坦化并研究不变性。谢谢，好主意，我会读到的