Когда и как происходит повторный рендеринг, когда магазины генерируют любое событие в потоке?

Question

Я новичок в реакции + поток. Я немного смущен тем, когда и как происходит повторный рендеринг, когда событие отправляется магазинами. В моем приложении я слушаю событие в функции componentWillMount(), которая вызывается непосредственно перед рендерингом happpens. Он отлично работает, и мои взгляды обновляются. Я только раз забочусь о том, что заставляет мой компонент повторно отображать. Ниже приведены коды.

функции для обновления магазина

createTodo(text){ 
const id = Date.now(); 
this.todos.push({ 
    id, 
    text, 
    complete:false 
}); 

this.emit("change"); 

Моего компонента - метод слушателя.

componentWillMount(){ 

TodoStore.on("change",() => { 
    this.setState({ 
     todos: TodoStore.getall() 
    }) 
}) 
} 

Вот что вызывает мой компонент для повторной визуализации? Не могли бы вы объяснить мне подробно.

Answer 1

Каждый раз, когда вы вызываете setState, компонент будет повторно рендер.

См: https://facebook.github.io/react/docs/component-api.html

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

Answer 2

Всякий раз, когда вы вызываете setState() в приложении для реагирования, он вызывает визуализацию состояния. В основном каждый раз, когда состояние изменяется, ваша функция рендеринга внутри вашего реагирующего компонента будет выполнена, и ваш пользовательский интерфейс будет отражен в новых изменениях.