2015-10-06 62 views
2

我相信我在這裏丟失了相當簡單的東西。然而,仍然很難找出答案。無法在React中綁定onChange函數

我試圖執行findItem功能時爲url輸入的值改變。用下面的代碼,我在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> 
    ); 
    } 
}); 

回答

8

你需要刪除引號

onChange={this.findItem}