Состояние потеряно после перезагрузки на странице ReactJs [дубликат]

Когда вы объявляете ссылочную переменную (т. е. объект), вы действительно создаете указатель на объект. Рассмотрим следующий код, в котором вы объявляете переменную примитивного типа int:

int x;
x = 10;

В этом примере переменная x является int, и Java инициализирует ее для 0. Когда вы назначаете его 10 во второй строке, ваше значение 10 записывается в ячейку памяти, на которую указывает x.

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

Integer num;
num = new Integer(10);

Первая строка объявляет переменную с именем num, но она не содержит примитивного значения. Вместо этого он содержит указатель (потому что тип Integer является ссылочным типом). Поскольку вы еще не указали, что указать на Java, он устанавливает значение null, что означает «Я ничего не указываю».

Во второй строке ключевое слово new используется для создания экземпляра (или создания ) объекту типа Integer и переменной указателя num присваивается этот объект. Теперь вы можете ссылаться на объект, используя оператор разыменования . (точка).

Exception, о котором вы просили, возникает, когда вы объявляете переменную, но не создавали объект. Если вы попытаетесь разыменовать num. Перед созданием объекта вы получите NullPointerException. В самых тривиальных случаях компилятор поймает проблему и сообщит вам, что «num не может быть инициализирован», но иногда вы пишете код, который непосредственно не создает объект.

Например, вы можете имеют следующий метод:

public void doSomething(SomeObject obj) {
   //do something to obj
}

В этом случае вы не создаете объект obj, скорее предполагая, что он был создан до вызова метода doSomething. К сожалению, этот метод можно вызвать следующим образом:

doSomething(null);

В этом случае obj имеет значение null. Если метод предназначен для того, чтобы что-то сделать для переданного объекта, целесообразно бросить NullPointerException, потому что это ошибка программиста, и программисту понадобится эта информация для целей отладки.

Альтернативно, там могут быть случаи, когда цель метода заключается не только в том, чтобы работать с переданным в объекте, и поэтому нулевой параметр может быть приемлемым. В этом случае вам нужно будет проверить нулевой параметр и вести себя по-другому. Вы также должны объяснить это в документации. Например, doSomething может быть записано как:

/**
  * @param obj An optional foo for ____. May be null, in which case 
  *  the result will be ____.
  */
public void doSomething(SomeObject obj) {
    if(obj != null) {
       //do something
    } else {
       //do something else
    }
}

Наконец, Как определить исключение & amp; причина использования Трассировки стека

29
задан DiverseAndRemote.com 4 February 2015 в 06:50
поделиться

4 ответа

Таким образом, мое решение было также установить localStorage при настройке моего состояния, а затем снова получить значение от localStorage внутри обратного вызова getInitialState следующим образом:

getInitialState: function() {
    var selectedOption = localStorage.getItem( 'SelectedOption' ) || 1;

    return {
        selectedOption: selectedOption
    };
},

setSelectedOption: function( option ) {
    localStorage.setItem( 'SelectedOption', option );
    this.setState( { selectedOption: option } );
}

Я не уверен, что это можно считать Anti-Pattern , но он работает, если не будет лучшего решения.

23
ответ дан DiverseAndRemote.com 20 August 2018 в 09:22
поделиться
  • 1
    Единственная часть этого, которую я бы рассматривал как «анти-шаблон», заключается в том, что ваш компонент сохраняет свое собственное состояние внутри localStorage. Если этот компонент использовался несколько раз, вам придется иметь дело с ключевыми коллизиями. Imo, информация, которая является такой важной (должна сохраняться в localStorage), вероятно, должна быть перенесена на более высокое состояние или уровень данных в архитектуре приложений ... но это самый простой способ выполнить работу до тех пор, пока детали не будут обработаны вне – Cory Danielson 4 February 2015 в 07:29
3
ответ дан juliangonzalez 20 August 2018 в 09:22
поделиться

У нас есть приложение, которое позволяет пользователю устанавливать «параметры» на странице. Мы делаем эти параметры в URL-адресе, используя React Router (вместе с историей) и библиотеку, которая URI-кодирует объекты JavaScript в формате, который может использоваться в качестве строки запроса.

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

history.push({pathname: 'path/', search: '?' + Qs.stringify(params)});

pathname может быть текущим путем. В вашем случае params будет выглядеть примерно так:

{
  selectedOption: 5
}

Затем на верхнем уровне дерева React React Router обновит props этого компонента с помощью функции location.search, которая это закодированное значение, которое мы установили ранее, поэтому в componentWillReceiveProps будет что-то вроде:

params = Qs.parse(nextProps.location.search.substring(1));
this.setState({selectedOption: params.selectedOption});

Затем этот компонент и его дочерние элементы будут повторно отображать с обновленной настройкой. Поскольку информация находится на URL-адресе, она может быть помечена закладкой (или отправлена ​​по электронной почте - это был наш прецедент), и обновление будет оставаться в том же состоянии. Это действительно хорошо работает для нашего приложения.

React Router: https://github.com/reactjs/react-router

История: https://github.com/ReactTraining/history

Библиотека строки запроса: https://github.com/ljharb/qs

2
ответ дан Matt Holland 20 August 2018 в 09:22
поделиться

Я считаю состояние для просмотра только информацией и данными, которые должны сохраняться за пределами состояния представления, лучше хранить в качестве реквизита. Параметры URL полезны, когда вы хотите иметь возможность ссылаться на страницу или делиться URL-адресами, находящимися в приложении, но в противном случае загромождать адресную строку.

Взгляните на Redux-Persist (если вы используя redux) https://github.com/rt2zz/redux-persist

3
ответ дан mattwarren 20 August 2018 в 09:22
поделиться
Другие вопросы по тегам:

Похожие вопросы: