Question

所以我试图将状态传递给Question组件。出于某种原因，国家不会被传下去。我确定它显而易见的是我失踪但我可以在这一个上使用另一双眼睛。谢谢！

Shelf

Answer 1

执行questions = this.state.questions;时，您正在引用该对象，而不是克隆它，因此不会触发组件状态的更新。我通常在这部分使用lodash，然后执行questions = _.cloneDeep(this.state.questions);

此外，render看起来并不合适。试试这个版本。

render: function() {
    var questions = this.state.questions.map((question, index) => {
        <Question {...this.props} key={index} index={index} question={question} />
        console.log(question);
    });

    return (
        <form className="quiz-form" onSubmit={this.handleSubmit} ref="form">
            {questions}
            <button type="button" className="add-question" onClick=  {this.addQuestion} disabled={this.state.questions.length === 5}>{this.state.questions.length < 5 ? 'Add another question' : 'Question limit reached!'}</button>
            <button type="submit">Create Quiz</button>
        </form>      
    );
}

道具不会传递给子组件

1 个答案: