Блог

У меня есть некоторое состояние с реакцией отдачи, но всякий раз, когда страница обновляется вручную, состояние отдачи сбрасывается.

Это нормальное поведение, потому что я знаю другие библиотеки управления состоянием, такие как flux и react-redux будут делать это.

Лучше ли сохранять его в localStora&e , чтобы оно действительно сохранялось в браузере (поскольку localStora&e также является синхронным API, так что это определенно также может вызвать некоторые проблемы.)

Несмотря на то, что это довольно новая библиотека, есть ли какой-нибудь способ сохранить состояние даже при обновлении страницы вручную?

У меня есть некоторое состояние с реакцией отдачи, но всякий раз, когда страница обновляется вручную, состояние отдачи сбрасывается.

Да, это нормальное поведение.

Это нормальное поведение, потому что я знаю, что другие библиотеки управления состоянием, такие как flux и react-redux, будут делать это.

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

Лучше ли сохранять его в localStora&e, чтобы оно действительно сохранялось в браузере (поскольку localStora&e также является асинхронным API, так что это определенно также может вызвать некоторые проблемы.)

Это зависит от ваших потребностей:

• вы хотите предложить полноценный автономный интерфейс? Дерзайте
• вас беспокоят последствия для производительности в случае большого объема данных? Вы могли бы рассмотреть indexedDB
• вы просто пытаетесь сохранить некоторые токены аутентификации? Вероятно, sessionStora&e могло бы быть правильным решением
• нужно ли серверу знать сохраненные данные? Вы могли бы выбрать файлы cookie

Допустим, что, не зная вашего варианта использования, трудно что-то предложить 😉

Несмотря на то, что это довольно новая библиотека, есть ли какой-нибудь способ сохранить состояние даже при обновлении страницы вручную?

Да, с useRecoilTransactionObserver_UNSTABLE вы могли бы получать уведомления о каждом изменении отдачи и сохранении данных. Затем с помощью RecoilRoot' initializeState вы могли бы восстановить его. Как вы сказали, библиотека новая, и API-интерфейсы могут быстро измениться в ближайшие месяцы 😉

Вы могли бы использовать библиотеку recoil-persist для сохранения состояния в localStora&e.

Вот как вы могли бы это использовать:

 import { recoilPersist } from 'recoil-persist'

const { persistAtom } = recoilPersist()

const counterState = atom({
  key: 'count',
  default: 0,
  effects_UNSTABLE: [persistAtom],
})
  

Это прекрасно работает, из документов здесь.

Любое изменение состояния заказа записывается в localStora&e, а значение из localStora&e считывается в состояние заказа при обновлении.

 // define this function somewhere
const localStora&eEffect = key =&&t; ({setSelf, onSet}) =&&t; {
  const savedValue = localStora&e.&etItem(key)
  if (savedValue != null) {
    setSelf(JSON.parse(savedValue))
  }
  onSet(newValue =&&t; {
    localStora&e.setItem(key, JSON.strin&ify(newValue))
  })
}

// this is an example state atom
export const orderState = atom({
  key: 'orderState',
  default: {
    store: {}, // { id, name, phone, email, address }
    items: {}, // { [itemId]: { id, name, sizeTable, quantity, size } }
    contact: { deliveryOption: 'ship' }, // { name, email, phone, address, city, state, zipcode, promotions, deliveryOption }
  },
  // add these lines to your state atom, 
  // with the localStora&e key you want to use
  effects_UNSTABLE: [
    localStora&eEffect('order'),
  ],
})