Question

如果值在接收到的道具和状态之间发生变化，我想比较文本区域的模糊程度。如果是，则触发某件事，否则我什么也不做。

我这样初始化状态：

constructor(props){
    super(props);
    this.state = {
        question : this.props.question,
        loadingQuestionsWithAnswers : true,
        posting : false,
        error : '',
        disabled : !isAuthorized('FILL_ASF')
    }
}

我的文本区域是：

<textarea id={`answer_${key}`}
                                    placeholder = "A comment ..."
                                    value={(this.state.question && this.state.question.answer) || ""}
                                    onChange={event => this.handleAnswer(event.target.value)}
                                    onBlur = {() => this.handleBlurAnswer()}
                                />

我在“ onChange”中更改状态：

handleAnswer = (value) => {

    let question = this.state.question;
    question.answer = value;
    this.setState({
        question : question
    }, function(){
        console.log('this.props.question dans le handleAnswer', this.props.question.answer);
        console.log('this.state.question dans le handleAnswer', this.state.question.answer);
    })

}

而且我不明白为什么 this.props.question 也已更改（我在控制台中看到了）。我只更新了状态。

我是React的初学者

感谢您的解释。

Dom

Answer 1

question : this.props.question

您要分配一个对象引用，所以 state 和 props 都引用同一个 question 对象。

您需要制作问题对象的副本，这取决于您是否希望它深一些。

浅：

question: Object.assign({}, this.props.question)

深：

question: JSON.parse(JSON.stringify(this.props.question))

反应：为什么道具变了？

1 个答案: