Question

每当输入的值发生变化时，我都希望在React组件中调用一些回调。

简化示例应该解释：

在ALTER TABLE [dbo].[Your_table] ADD New_Column Date UPDATE your_table SET New_Column = CAST(Old_Column as Date) ALTER TABLE Your_table DROP COLUMN Old_Column文件中：

jsx

<input onKeyDown={this.props.changeCallback( VALUE_OF_INPUT )} ></input>应该是什么？

谢谢！

Answer 1

对此没有特定的React特异性。使用传递给回调的event作为第一个参数：

onKeyDown={event => this.props.changeCallback(event.target.value)}

这种方法（使用fat arrow function）也处理绑定this，代价是每次渲染创建一个新的匿名函数。请注意，调用bind基本上会执行相同的操作，因此这是我在两者中的首选选项。

区分将函数分配给onKeyDown属性（如此处所做）与调用函数（你做了什么）之间的区别非常重要。

Answer 2

会做这个工作。

Answer 3

另一种动态方法是给它一个值回调，如果预先填充＆＃34;值＆＃34;来自一些变种

/* Better function for larger forms */
handleChange = (event) =>  {
    var name = event.target.name;
    var value =  event.target.value;
    this.setState({[name]: value});
}
/* set Default and callback to state */
valueCallback = (value, name) => {
    if (this.state[name]) {
        return this.state[name]
    }
    else {
        return value;
    }
}

然后你可以去......

 var defaut = '1234'; // or this.props.something.something;

 <input type={type} name={name} value={this.valueCallback(defaut, name)}  onChange={this.handleChange} />

在React中，如何将输入值传递给回调函数？

3 个答案: