React this.onChange() 没有调用内部映射函数

Question

当我在 map 方法中调用 onChange 函数时出现以下错误

Uncaught TypeError: Cannot read property 'onCheckChange' of undefined at onChange

我的代码如下

  getPlanCheckbox(jsonParseservicelist, bbuserid) {
        const returnresult = jsonParseservicelist.map(function (single) {
          return (
            <div className="">
              <label className="" >
                <input type="checkbox" onChange={() => this.onCheckChange(bbuserid, single.plantype)} defaultChecked={single.isActive == 1 ? "checked" : ""} />
                <span className="" />
              </label>
            </div>);
        });
        return returnresult;
      }



    onCheckChange = (e, bbuid, plantype) => {
        console.log(bbuid, plantype);

      }

Answer 1

我试试这个，我找到了 2 个解决方案

1st 只是将您的函数替换为以下

getPlanCheckbox(jsonParseservicelist, bbuserid) {
    var self = this;
    const returnresult = jsonParseservicelist.map(function (single) {
      return (
        <div className="">
          <label className="" >
            <input type="checkbox" onChange={() => self.onCheckChange(bbuserid, single.plantype)} defaultChecked={single.isActive == 1 ? "checked" : ""} />
            <span className="" />
          </label>
        </div>);
    });
    return returnresult;
  }

只需将 this 带入另一个 variable 和用户该变量名即可调用函数让我们说

var self = this;

现在我使用 self 来调用这样的函数

self.onCheckChange();

第二个是使用地图作为箭头函数

data.map((single) => {
})

Answer 2

将 map 函数定义为箭头，否则，this 将不是全局上下文。同样适用于 getPlanCheckbox 函数，如果您没有在构造函数中绑定 this：

  getPlanCheckbox = (jsonParseservicelist, bbuserid) => {
        const returnresult = jsonParseservicelist.map((single) => {
          return (
            <div className="">
              <label className="" >
                <input type="checkbox" onChange={() => this.onCheckChange(bbuserid, single.plantype)} defaultChecked={single.isActive == 1 ? "checked" : ""} />
                <span className="" />
              </label>
            </div>);
        });
        return returnresult;
      }

React this.onChange() 没有调用内部映射函数

React this.onChange() is not calling inside map function

dictionary

onchange

reactjs