Изменить значение дочернего узла из списка внутри ключа родительского значения
Реквизит vs state summary Мне нравится лучше всего здесь: https://github.com/uberVU/react-guide/blob/master/props-vs-state.md Большая подсказка для шляпы эти ребята. Ниже приведен отредактированный вариант этой страницы:
props vs state
tl; dr Если компоненту необходимо изменить один из его атрибутов в какой-то момент времени, этот атрибут должен быть частью его состояния, иначе он должен быть просто опорой для этого Компонента.
реквизит
Опоры (short для свойств) являются конфигурацией компонента. Они получены сверху и неизменны, если речь идет о Компоненте, принимающем их. Компонент не может изменить свои реквизиты, но он отвечает за объединение реквизитов своих дочерних Компонентов.
state
Состояние - это структура данных, которая начинается со значения по умолчанию, когда компонент монтируется в качестве реквизита. , Он может быть изменен во времени, главным образом в результате пользовательских событий.
Компонент управляет своим собственным внутренним состоянием. Помимо установки начального состояния, у него нет бизнеса, играющего с состоянием его детей. Вы можете концептуализировать состояние как личное для этого компонента.
Изменение реквизита и состояния
props state
Can get initial value from parent Component? Yes Yes
Can be changed by parent Component? Yes No
Can set default values inside Component?* Yes Yes
Can change inside Component? No Yes
Can set initial value for child Components? Yes Yes
Can change in child Components? Yes No
- Обратите внимание, что и реквизиты, и начальные значения состояния, полученные от родителей, переопределяют значения по умолчанию, определенные внутри Компонент.
Если этот компонент имеет состояние?
Состояние является необязательным. Поскольку состояние увеличивает сложность и снижает предсказуемость, предпочтительным является компонент без состояния. Несмотря на то, что вы явно не можете обойтись без состояния в интерактивном приложении, вам следует избегать слишком большого количества компонентов состояния.
Типы компонентов
Безстоящий компонент Только реквизиты, состояние отсутствует. С функцией render () не так много происходит. Их логика вращается вокруг реквизита, который они получают. Это делает их очень легкими для наблюдения и проверки.
Компонент состояния. Оба реквизита и состояние. Они используются, когда ваш компонент должен сохранять определенное состояние. Это хорошее место для взаимодействия клиент-сервер (XHR, веб-сокеты и т. Д.), Обработки данных и реагирования на пользовательские события. Такие логистики должны быть инкапсулированы в умеренное количество компонентов Stateful, в то время как вся логика визуализации и форматирования должна перемещаться вниз по потоку во многие компоненты без учета состояния.