Question

我想使用React v0.13.3构建一个考试生成器。问题是当我单击Add a choice时，我作为问题元素的prop传递的回调函数是未定义的。这是完整的片段。

顺便说一下，我已经粘贴了转换过的脚本，你应该想要jsx脚本吗？这是not-yet-transformed.js

Answer 1

这是因为在你的考试组件的map函数里面，渲染方法这个关键字并没有引用考试组件对象。您可以修复Es6箭头功能的问题，也可以创建名为 _this 的局部变量，并在地图功能之前将此分配给 _this

带箭头功能

    var questions = this.state.questions.map((question, index) =>{
        return (
            React.createElement(Question, {
                key: index, 
                index: index, 
                src: question, 
                handleAddChoice: this.onAddChoice})
        );
    });

jsfiddle http://jsfiddle.net/jkwhrs1j/

使用局部变量赋值 jsfiddle http://jsfiddle.net/gzevgjfb/

Answer 2

按照pashaplus的回答，您还可以将context参数传递给map函数，如下所示：

var questions = this.state.questions.map(function (question, index) {
    return (
        <Question 
            key={index} 
            index={index} 
            src={question} 
            handleAddChoice={this.onAddChoice} />
    );
}, this);

reactjs传递回调导致未定义

2 个答案: