Question

该错误在StackOverflow上似乎是众所周知的，但是没有任何文章提供给我适合我的解决方案。我不能在未得到错误的情况下在子元素中建议按钮或复选框：

无法读取未定义的属性“数据”

该示例并不完美，因为它还不能完全重现我所遇到的问题，但是已经很好地说明了我想做的事情和做事的方式：https://codesandbox.io/s/test-uz-713xy

全局目标是显示表中的配置文件，并能够显示弹出窗口以根据所选配置文件修改信息

Answer 1

我做了2次更改，现在您的codeandbox示例运行正常。我已经评论了我在渲染中进行过更改的地方。

     render() {
    let func = this.editChild;   // CHANGE HERE
    return (
      <div className="Profil">
        {this.state.data.map(function(panel) {
          return (
            <div className="cHildContener">
              <h1> Hello my name is {panel.name}</h1>
              <h2> I'm {panel.age} years old</h2>
              <Button
                onClick={() => {
                  func(false); // CHANGE HERE
                }}
              >
                EDIT
              </Button>
            </div>
          );
        })}
        {this.state.PopupEdit ? (
          <div className="PopUP">
            <h1>EDIT A CHILD</h1>
            <p>
              I would like display the name of the concerned child, but i don't
              know how to do
            </p>
            <input
              type="text"
              value={this.state.firstname}
              onChange={this.onFieldChange("firstname").bind(this)}
              placeholder="children new name"
              required
            />
            />
            <input
              className="slave"
              type="text"
              value={this.state.age}
              onChange={this.onFieldChange("age").bind(this)}
              placeholder="children age"
              required
            />
            <Button
              onClick={() => {
                this.editChild(true);
              }}
            >
              EDIT
            </Button>
          </div>
        ) : null}
      </div>
    );
  }

无法读取未定义的属性“数据”

1 个答案: