Question

var B = React.createClass({
    render: function() {
    return (
        <div>
            <input type="button" onClick={this.props.saveFunction} />        
        </div>
    );
  }
});

var A = React.createClass({
    render: function() {
        return (
            <div>
                <B saveFunction={this.save} />        
            </div>
        );
    },
    save: function(){
        //Save code
    }
});

您好，我在facebook做反应js。我创建了两个组件，其中A是父组件，B是子组件。我在A中编写了Save函数，并将其引用作为“props”传递给组件B. 我将此Save函数引用传递给从B渲染的按钮的“onClick”事件，我还想在用户按下ENTER按钮时保存这些值。所以，我试图将相同的引用传递给相同按钮的“onKeyDown”事件。但是，它不起作用。 Contstraint是：我不能将保存功能从A转移到B. 请让我知道如何实现这一目标。提前谢谢！

Answer 1

我将this.save函数传递给子元素，它会丢失它的上下文（当关键字save指向this元素时，JavaScript会执行B函数。

将该函数绑定到.bind(this)，如： <B saveFunction={this.save.bind(this)} />

如何调用KeyDown事件中子组件中父组件中定义的函数？

1 个答案: