Как установить объект JSON из local.storage, используя setState с React Hooks - PullRequest
0 голосов
/ 11 апреля 2020

Рассмотрим следующее - у меня есть условие, которое проверяет local storage на JSON object и, если оно не существует, оно устанавливает его в локальном хранилище:

Оно устанавливается правильно:

enter image description here

НО если он существует, я бы хотел получить его из локального хранилища и установить его в моем состоянии с помощью useState:

export default function Day({ dayInfo }) {


var [dayInfoInChild, setDayInfoInChild] = useState([]);

  useEffect(() => {
    if (dayInfo !== null) {
      var modifiedDayInfo = dayInfo
        .split(' ')
        .map((item) => {
          if (item.indexOf(',')) return item.replace(/,/g, '');
        })
        .join('-');

      if (localStorage.getItem(modifiedDayInfo)) {
        setDayInfoInChild((dayInfoInChild) => [
          ...dayInfoInChild,
          modifiedDayInfo,
        ]);
        console.log('dayInfoInChild', dayInfoInChild);
      } else {
        localStorage.setItem(modifiedDayInfo, JSON.stringify({}));
      }
    }
  }, [dayInfo]);

Журнал возвращает:

`dayInfoInChild` ["April-2-2020", "April-3-2020"]

Мне бы хотелось, чтобы это было:

`dayInfoInChild` ["April-2-2020" : "{}", "April-3-2020": "{}"]`

Как это достигается? Чёрные маги c приветствуются ...

1 Ответ

1 голос
/ 11 апреля 2020

Похоже, что вы sh только в состояние modifiedDayInfo.

Вы должны также взять значение из локального хранилища:

Я не проверял его, но это должно быть что-то вроде этого

 setDayInfoInChild((dayInfoInChild) => [
              ...dayInfoInChild,
              {[modifiedDayInfo],JSON.parse(localStorage.getItem("April-2"))},
            ]);

В коде:

export default function Day({ dayInfo }) {


var [dayInfoInChild, setDayInfoInChild] = useState([]);

  useEffect(() => {
    if (dayInfo !== null) {
      var modifiedDayInfo = dayInfo
        .split(' ')
        .map((item) => {
          if (item.indexOf(',')) return item.replace(/,/g, '');
        })
        .join('-');

      if (localStorage.getItem(modifiedDayInfo)) {
        setDayInfoInChild((dayInfoInChild) => [
          ...dayInfoInChild,
          {[modifiedDayInfo],JSON.parse(localStorage.getItem("April-2"))
         },
        ]);
        console.log('dayInfoInChild', dayInfoInChild);
      } else {
        localStorage.setItem(modifiedDayInfo, JSON.stringify({}));
      }
    }
  }, [dayInfo]);

Надеюсь, это поможет вам!

...