Предположим, есть дерево список>элемент списка->форма->кнопка сабмит. Мне нужно отрендерить дерево заново при нажатии на сабмит, как я могу это сделать?
1 ответ
Если каждый из описанных вами элементов представляет отдельный компонент, то вы можете передать из компонента верхнего уровня функцию, меняющую его state. Эта техника называется подъём состояния, подробнее можно почитать тут.
-
Я видимо не могу понять. Я должен передать из списка в элемент, из элемента в форму State самого списка? Затем мне придет это состояние в this.props в форму, как мне изменить его потом?– Enkei14 апр 2019 в 13:52
-
1@Enkei нет, нужно передавать функцию, объявленную в компоненте родителя (списка в вашем случае) и меняющую его state, через props-ы, после чего вызывать её в нужном дочернем компоненте– Regent14 апр 2019 в 14:44
-
@Enkei в родительском компоненте вы можете определить функцию onClick = () => this.setState({ toggle: true }); Затем передайте её дочерним компонентам через пропсы и вызывайте в нужный момент. 14 апр 2019 в 14:45
-
@smolin-pavel Окей, я сделал это, все работает. Теперь вопрос в другом: я делаю запрос на сервер в componentDidMount в компоненте списка, он изменяет state несколько раз. Когда я изменяю this.state.toggle, componentDidMount не выполняется повторно и не получает новые данные с сервера. В какой метод мне нужно перенести запрос на сервер, чтобы он выполнялся при каждом обновлении state?– Enkei14 апр 2019 в 15:50
-
@Enkei все верно, componentDidMount отрабатывает только один раз. Можно использовать componentDidMount (для первого рендера) и componentDidUpdate (для последующих обновлений). Подробнее - тут ru.reactjs.org/docs/react-component.html#componentdidupdate 14 апр 2019 в 16:10