通过 returns 输入的组件接收 onPaste / onChange

Question

基本上我正在尝试做这样的事情：

<MyTextInput onChange={console.log("Change")} />

这个组件只是 returns 一个 <input type="text" /> 当我在里面打字时什么也没有发生（在这里使用组件的原因是为了将来在输入周围添加更多的布局）。此外 event.target.value 在 MyTextInput

上未定义

Answer 1

在这种情况下，您需要将事件处理程序传递给子组件，然后在 MyTextInput 组件中调用 onChange 回调，

var MyTextInput = React.createClass({
  render: function() {
    return <input onChange={ this.props.onChange } />;
  }
});

var Main = React.createClass({
  render: function() {
    return <div>
      <MyTextInput onChange={ (e) => { console.log(e.target.value) } } />
    </div>
  }
});

Example

通过 returns 输入的组件接收 onPaste / onChange

receiving onPaste / onChange through a component that returns input

javascript

reactjs

redux