Приложение React — TypeError: невозможно добавить свойство setState, объект не расширяемый
Я очень новичок в кодировании, поэтому, пожалуйста, извините меня, если мой вопрос неверен.
Я пытаюсь создать приложение для пустяков с реакцией, но, похоже, оно не работает. В настоящее время я работаю над тем, чтобы приложение переходило от одного вопроса к другому при нажатии на ответ.
Теперь я получаю эту ошибку TypeError: невозможно добавить свойство setState, объект не расширяемый. Я уже чувствую себя немного отчаявшимся, потому что мне кажется, что ничего не работает.
Может ли кто-нибудь помочь мне и указать, что мне делать дальше?
Общая информация.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>
)
}
}
this.setState(() => { return{questionId: this.state.questionId + 1} })
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 4
Вы назначаете setState здесь:
this.setState = () => {
return{questionId: this.state.questionId + 1}
};
Вы должны быть вызов это:
this.setState(state => {
return {
questionId: state.questionId + 1
};
});
Изменять
this.setState = () => {
return{questionId: this.state.questionId + 1}
};
К
this.setState(prevState => ({
return {questionId: prevState.questionId + 1}
))};
Я предполагаю, что ваша цель - иметь состояние по умолчанию для вашего класса.
То, что вы пытаетесь сделать, называется Поле класса и в настоящее время находится в статусе предложения, поэтому оно у вас не работает. Вы можете либо установить что-то, что преобразует это в действительный javascript, либо установить состояние по умолчанию, подобное этому.
class MyComponent extends Component {
constructor(props) {
super(props);
questionId: 0
state = {
};
}
}
Вам всегда нужно передавать свое предыдущее состояние в жизненном цикле в качестве параметра, если вы вызываете this.setState() таким образом.
nextQuestion () {
this.setState = (prevState) => {
return{questionId: this.prevState.questionId + 1}
};
};
Вы расширяете класс Component? С помощью конструктора?