Реагировать: значение setState не работает при обновлении Интернета

Question

Я создал переменную a в конструкторе app.js моего приложения, и я схожу с ума, обновляя ее значение.

this.state = {
    a: "1"
}

Первоначально я создал функцию AddA(), чтобы обновить ее значение при нажатии кнопки:

async addA(){
    this.a=2;
};

Но я понял, что setState был асинхронным, поэтому, когда я обновил страницу, показанное значение является исходным, определенным при его инициализации, поэтому я обновляю logi c моей функции следующим образом:

AddA = () => {    
   this.setState({
      a: 2
   })
}

Но я не знаю, почему, по какой-либо причине мой компилятор говорит, что определенный синтаксис неверен:

Есть предложения?

Answer 1

Когда вы обновляете sh страницу, состояние будет сброшено до исходного значения, поскольку страница будет перемонтирована и будет вызван конструктор. Итак, чтобы сохранить данные, вы можете использовать следующие инструменты:

1. Persisted Store
2. Localstorage
3. Cook ie
4. База данных

Вы можете использовать любой из них в соответствии с вашим вариантом использования.

Относительно получаемой вами ошибки:

Замените вас Функция AddA от:

AddA = () => {

  this.setState({
    a: 2
  })
}

до

const AddA = () => {

  this.setState({
    a: 2
  })
}

или

function AddA() {
    
      this.setState({
        a: 2
      })
    }

Answer 2

Если вы манипулируете данными на стороне клиента, вы можете использовать localstorage. Вот сайт, демонстрирующий, как это сделать

Answer 3

Инициализация значения состояния происходит при монтировании страницы. Пока компонент остается смонтированным, вы можете управлять значениями state. onRefresh страница будет снова unmounted и mount, таким образом, более старое состояние больше не останется и произойдет re-initialization.

если вы действительно хотите, чтобы эти данные сохранялись, пожалуйста, используйте redux-persisted store или сохраните свои данные в cookie или server - which is advisible.