Question

为什么我的组件方法onClick无法启动？当用户单击下拉菜单项时，应使用.bind（）函数激活以下方法，但是什么也没有发生，当以更高的组件级别应用于我的应用程序的其他部分时，此方法可以正常工作。

呈现组件的Typescript文件：

5........5
54......45
543....345
5432..2345
5432112345

我试图绑定到方法：

export const Options = props => (
  <div>
    <Dropdown isOpen={props.modalDropDown} toggle={props.toggleDropDown.bind()}>
      <DropdownToggle caret>{props.totalWorkloadOptions.optionTitle}</DropdownToggle>
      <DropdownMenu>
        {props.totalWorkloadOptions.options.map(op => (
          // tslint:disable-next-line:no-invalid-this
          <DropdownItem key={op} onClick={props.appendChoiceList.bind(props.totalWorkloadOptions.optionTitle, op)}>
            {op}
          </DropdownItem>
        ))}
      </DropdownMenu>
      <strong> {props.totalWorkloadOptions.optionDescription} </strong>
    </Dropdown>
    <br />
  </div>
);

Answer 1

我相信您正在尝试

onClick={() => props.appendChoiceList(props.totalWorkloadOptions.optionTitle, op)}

不是.bind()

我认为您对.bind的理解有误。看一下https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_objects/Function/bind

中的语法

在下拉菜单项上使用onClick时，bind（）不运行

1 个答案: