React App - TypeError:无法添加属性 setState，对象不可扩展

Question

我对编码很陌生，所以如果我的问题不正确，请原谅我。

我正在尝试创建一个带有反应的琐事应用程序，但它似乎不起作用。我目前正在努力使应用程序在单击答案时从一个问题跳到另一个问题。

我现在收到此错误类型错误：无法添加属性集状态，对象不可扩展。我已经感到有点绝望了，因为似乎没有什么对我有用。

任何人都可以帮助我并指导我下一步应该做什么吗？

琐事.js：

    state = {
        questionId: 0
    };
nextQuestion () {
    this.setState = () => {
        return{questionId: this.state.questionId + 1}
    };
};
render(){
    return(
        <div>
            <Question 
                trivia = {quizList[this.state.questionId]} 
                onClick = {this.nextQuestion}
            />
        </div>
    )
}

问题.js

render(){
    return(
        <div>
            <div>
                <h2>{this.props.quiz.question}</h2>
            </div>
            <div>
                {this.props.quiz.answers.map((quizAnswer)=>
                    <li onClick={()=>this.props.onClick()}>
                        {quizAnswer.ans}
                    </li>
                )} 
            </div>
       </div>
    )
}

}

Answer 1

您在此处分配给setState：

this.setState = () => {
    return{questionId: this.state.questionId + 1}
};

你需要调用它：

this.setState(state => {
  return {
    questionId: state.questionId + 1
  };
});

Answer 2

更改

     this.setState = () => {
    return{questionId: this.state.questionId + 1}
};

自

     this.setState(prevState => ({
         return {questionId: prevState.questionId + 1}
    ))};

Answer 3

我假设你的目标是为你的类设置默认状态

您要执行的操作称为"类"字段，当前处于提案状态，因此这就是它不适合您的原因。您可以安装一些东西，将其转换为有效的javascript，也可以像这样设置默认状态

class MyComponent extends Component {
  constructor(props) {
    super(props);
       questionId: 0
    state = {
    };
  }
}

Answer 4

如果您以这种方式调用 this.setState((，则始终需要在生命周期中传递以前的状态作为参数。

nextQuestion () {
    this.setState = (prevState) => {
        return{questionId: this.prevState.questionId + 1}
    };
};