Блог

Главная - Вопросы по программированию - setState не обновляет состояние даже при обратном вызове и функции управления — ReactJS

setState не обновляет состояние даже при обратном вызове и функции управления — ReactJS

#javascript #reactjs #state

Вопрос:

У меня есть функция обработки, которая вызывается в другом компоненте. Это передает значение под названием данные, которые я хочу обновить в свой state .

 //basic code
initialState = {
  wordCount:"Some Value"
  text: "Some value"
}
class Home extends Component{
  state = initialState;
  handler(data){
    console.log('Arrived',data)
    this.setState({wordCount:data,text:GetText(data,this.state)});
    this.validation();
  }
  validation(){
    console.log(this.state.wordCount)
  }
  render(){
  return (
      <div><Component handlerFunc={this.handler.bind(this)}</div>
  )
  }

Распечатка data в моей функции обработчика я действительно получаю правильную информацию в виде строки. Я использую setState для замены wordCount начального значения на data . Я делаю то же самое с text . GetText возвращает строку.

Но когда выполняется проверка, мое состояние точно такое же. Как это могло случиться?

Ответ №1:

Примечание: setState в react является асинхронным.

Это означает, что нет никакой гарантии, что состояние изменится к следующему заявлению. Что вы можете сделать, чтобы избежать этого, так это то, что setState принимает обратный вызов, который будет вызван, когда состояние set завершится.

 this.setState(
   {
       wordCount:data,
       text:GetText(data,this.state)
   }, 
   () => { 
    // Gets called when setState updates the state
    this.validation() 
});

Комментарии:

1. ОК. Но проверка больше не вызывается (просто функция проверки). бревна this.state.wordCount . Я не вижу выхода, потому что я изменил это. Что я делаю не так?

2. @BuddyBob У вас могут возникнуть проблемы с использованием this . Попробуйте получить доступ к состоянию внутри обратного вызова или используйте журнал консоли. Вы увидите, что состояние определенно изменится

3. Со мной никогда не связывались this . Как это может быть неправильно. Кроме того, в моем обратном вызове я выполняю проверку. В котором есть console.log(). Похоже, что он никогда не запускается в первую очередь.

4. @BuddyBob Arrived Печатается в форме консоли выше примера? Затем вы получите console.log() в коде. Если ничего нет, то вы, возможно, столкнулись с ошибкой в GetText(data,this.state) этой функции. Попробуйте использовать обработчики ошибок и посмотрите, есть ли какие-либо ошибки

5. Сумасшедшее право. Я вызываю GetText отдельно, отлично работает, когда я консолирую. запишите это в журнал. Поступившее также регистрируется. У меня болит мозг, лмао.

Метки: