Установить начальное состояние с использованием локального / сеансового хранилища в приложении реакции
Я хочу инициировать свое состояние с использованием локального / сеансового хранилища. Верен ли такой подход? Я пробовал, но выдает ошибку. Если нет, то как я могу получить значение из хранилища непосредственно в свое состояние?
constructor(props) {
super(props);
sessionStorage.setItem('testkey','test value')
this.state = {
abc: sessionStorage.getItem('testkey')
}
}
Ошибка всегда неопределенная.
Кроме того, если я использую наоборот, приведенный ниже код отлично работает
constructor(props) {
super(props);
this.state = {
abc: this.getItems(val)
}
this.getItems = this.getItems.bind(this);
}
getItems(value){
let selectedItem = value;
return selectedItem;
}
Но когда я это делаю, этого не происходит. Я просто не могу получить значение из своего хранилища сеансов.
constructor(props) {
super(props);
this.state = {
abc: this.getItems(val)
}
this.getItems = this.getItems.bind(this);
}
getItems(val){
let setItem = sessionStorage.setItem('testkey', val);
let getItem = sessionStorage.getItem('testkey');
return getItem;
}
Когда я регистрирую getItem на своей консоли, он дает мне объект. В чем может быть проблема?
удалить точку с запятой после abc: sessionStorage.getItem('testkey');
В вашем примере вы можете просто установить состояние abc на тестовое значение. Нет никакой пользы от записи в хранилище. Но скажем, вы получаете значение откуда-то еще, тогда вы можете установить его таким образом в функции и получить в своем конструкторе. Тогда ваш подход будет действительным.
Какую ошибку вы получили? Какая строка вызвала ошибку?
Я обновил вопрос, пожалуйста, проверьте и извините за задержку.
почему бы вам просто не обновить значение свойства в состоянии?
Я пытался. Тоже не работает. Проблема сохраняется, когда я пытаюсь получить значение из sessionStorage.
Ответы 1
Я все еще не совсем понимаю, что вы имеете в виду, но вам определенно нужно использовать this.setState ().
эта функция принимает json {'key': 'value'} после установки обновляет состояние. На самом деле вам не нужно хранить функцию в состоянии.
Я не знаю, использовались ли здесь геттеры и сеттеры. Установите значения переменных с помощью setState, затем извлеките их с помощью this.state. [Имя_переменной].
Надеюсь это поможет.
class Session extends Component {
constructor(props){
super(props);
this.setValue = this.setValue.bind(this);
this.state = {};
}
setValue(key, value){
let data = {};
data[key] = value;
this.setState(data);
}
render() {
let session = this.state.session;
return (
<div >
<div>{ session }</div>
<input onClick = { ()=> this.setValue('session','Hello') } type = "button" value = "Click Me" />
</div>
);
}
}
export default Session;
Удачного кодирования.
В чем ошибка?