Как получить изменённый state в react.js?

Пользователь

от quinton.prosacco , в категории: JavaScript , год назад

Как получить изменённый state в react.js?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от narciso , год назад

@quinton.prosacco 

Пользователь

от francisco.friesen , 2 месяца назад

@quinton.prosacco 

В React.js, состояние компонента можно получить с помощью this.state. Однако, для получения измененного состояния, необходимо использовать функцию обратного вызова setState. Эта функция обновляет состояние компонента и вызывает обновление визуального отображения компонента.


Пример использования setState в компоненте:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      value: ''
    };
  }

  handleChange(event) {
    this.setState({ value: event.target.value }, () => {
      console.log(this.state.value); // получение измененного состояния
    });
  }

  render() {
    return (
      <div>
        <input type="text" value={this.state.value} onChange={this.handleChange.bind(this)} />
      </div>
    );
  }
}


В приведенном примере, handleChange обновляет значение состояния value каждый раз, когда пользователь вводит текст в поле ввода. Затем, функция обратного вызова в setState логирует измененное состояние в консоль.