reactjs - 无法在 React 中绑定(bind) onChange 函数

Question

我确定我在这里遗漏了一些相当简单的东西。然而，仍然很难弄清楚。

当 url 输入的值发生变化时，我正在尝试执行 findItem 函数。使用下面的代码，我在 Chrome 中收到此警告:

Warning: Failed propType: Invalid prop `onChange` of type `string` supplied to `ReactDOMInput`, expected `function`. Check the render method of `ItemForm`.

相关代码如下:

ItemForm = React.createClass({
  findItem(event) {
    console.log(event.target.value);
  },
  render() {
    return (
      <tfoot>
        <tr className="ui form">
          <td>
            <div className="field">
              <label>Product URL</label>
              <div className="ui active small inline invisible loader"/>
              <input className="url" onChange="{this.findItem}" placeholder="Enter the URL of the product you wish to purchase" type="text"/>
            </div>
          </td>
          <td className="numeric">
            <div className="field">
              <label>Quantity</label>
              <input className="qty" disabled="disabled" type="text"/>
            </div>
          </td>
          <td className="numeric">
            <div className="field">
              <label>Total Cost</label>
              <div className="ui labeled input">
              <div className="ui label">$</div>
                <input disabled="disabled" type="text"/>
              </div>
            </div>
          </td>
        </tr>
        <tr className="ui form">
          <td>
            <div className="fields">
              <div className="eight wide field title">
                <label>Product Title</label>
                <textarea disabled="disabled" rows="2"/>
              </div>
              <div className="eight wide field">
                <label>Optional Comments</label>
                <textarea disabled="disabled" rows="2"/>
              </div>
            </div>
          </td>
          <td/>
          <td className="btn">
            <button className="ui disabled positive button">Add</button>
          </td>
        </tr>
      </tfoot>
    );
  }
});

Answer 1

你需要去掉引号

onChange={this.findItem}