Статьи / JavaScript / Reactjs (документация, руководство, примеры, flux) / Справочник (Reference)

Компонент API

Экземпляры компонента React создаются внутри React при рендеринге. Эти экземпляры повторно используются в последующих рендерингах и могут быть доступны в ваших методах компонентов, как this. Единственный способ получить идентификатор экземпляра React компонента за пределами React это сохранить возвращаемое значение React.render. Внутри других компонентов, вы можете использовать refs, чтобы достичь того же результата.

setState

setState(object nextState[, function callback])

Объединяет nextState с текущим состоянием. Это основной метод который вы используете, чтобы вызвать обновления пользовательского интерфейса из обработчиков событий и обратных вызовов из запросов к серверу. Кроме того, вы можете передать опциональную функцию обратного вызова, которая выполняется один раз по завершении setState и перерендоривания компонента (component is re-rendered).

Примечания:

НИКОГДА не изменяйте this.state непосредственно, вызовом setState() который после может заменить изменения которые вы сделали. Обрабатывайте this.state, как будто оно было неизменным.

setState() не сразу изменяет this.state, но создает состояние отложенного перехода. Доступ this.state после вызова этого метода потенциально может вернуть существующее значение.

Нет никакой гарантии, синхронной работы операций вызова setState, вызовы могут группироваться в целях повышения производительности.

setState() всегда будет вызывать повторный рендеринг, пока условная логика рендеринга не реализуется в shouldComponentUpdate(). Если изменяемые объекты используются и логика не может быть реализована в shouldComponentUpdate(), вызывается setState() только тогда, когда новое состояние отличается от предыдущего состояния чтобы избежать ненужного ререндеринга.

replaceState

replaceState(object nextState[, function callback])

Как setState(), но удаляет любые ранее существующие ключи состояния, которые не находятся в nextState.

forceUpdate()

forceUpdate([function callback])

Если ваш render() метод читает не из this.props или this.state, а из чего-то другого, вы должны сказать React, когда он должен снова запустить render() путем вызова forceUpdate(). Вы также должны вызывать forceUpdate(), если вы изменили this.state напрямую.

Вызов forceUpdate() вызовет render() на компоненте и его детях, но React будет по-прежнему обновлять DOM, только если измененится разметка.

Как правило, вы должны стараться избегать все виды использования forceUpdate() и читать только из this.props и this.state в render(). Это сделает ваше приложение гораздо более простым и эффективным.

getDOMNode

DOMElement getDOMNode()

Если этот компонент был примонтирован в DOM, этот метод вернет соответствующий родной элемент DOM браузера. Этот метод полезен для чтения значений из DOM, такие как значение поля формы и выполнение измерений DOM. Когда render возвращается null или false, this.getDOMNode() возвращает null.

isMounted()

bool isMounted()

isMounted() возвращает true, если компонент оказывается в DOM, false в противном случае. Вы можете использовать этот метод, чтобы защитить асинхронные вызовы setState() или forceUpdate().

setProps

setProps(object nextProps[, function callback])

Когда вы интегрируетесь с внешним приложением JavaScript вы можете желать получать сигналы изменения в React компонентах, отрендеренного React.render().

Хотя вызов React.render() снова на тот же узел является предпочтительным способом для обновления компонента корневого уровня, вы также можете вызвать setProps(), чтобы изменить его свойства и вызвать повторный рендеринг. Кроме того, вы можете передать дополнительную функцию обратного вызова, которая выполняется один раз по завершении setProps и повторного рендеринга компонента.

Примечание:
Когда это возможно, декларативный подход вызова React.render() снова является предпочтительными; это приводит к тому, что об обновлениях легче рассуждать. (Нет существенной разницы в производительности между этими двумя подходами.)

Этот метод может быть вызван только на компоненте корневого уровня. Поэтому, он доступен только на компоненте переданном непосредственно в React.render() и ни на одном из его потомков. Если вы склонны к использованию setProps() на дочернем компоненте, вместо использования реактивных обновлений, то передайте новое свойство в дочерний компонент при его создании в render().

replaceProps

replaceProps(object nextProps[, function callback])

Как setProps(), но удаляет любые ранее существующие свойства, вместо слияния двух объектов.