Когда нужно использовать props, а когда state?

Question

[InterestingPerson]

Когда нужно использовать props, а когда state?

Answer 1

[Алексей]

props только для чтения - параметры переданные из <MyElement param1={param1} param2={param2} />

state текущее состояние элемента, которое мы можем переписать в любой момент внутри элемента

Answer 2

[Руслан Абдуллаев]

State - это внутреннее изменяемое состояние компонента, props - это внешние "неизменяемые" данные, которые передаются через родителя

"неизменяемые" - это скорее пожелание, а не аксиома

Comments

[Никита Гущин]

Эм ... вы изменяете props внутри компонента? Это скорей аксиома, причем не реакта, а ФП в целом. Так как снаружи компонент выглядит как функция от свойств.

[Руслан Абдуллаев]

Никита Гущин: Нет, не изменяю, сноска лишь говорит о том, что этого делать не стоит, но иммутабельность props - это, в первую очередь, соглашение, а не только техническое ограничение

[Никита Гущин]

Руслан Абдуллаев: Хитрая у вас формулировка ... какой тогда смысл заострять на этом внимание? Ведь если мы изменим props внутри компонента - все сломается.

[Никита Гущин]

Руслан Абдуллаев: но в любом случае: неизменность props - это требование, никак не пожелание.

Answer 3

[Никита Гущин]

Когда нужно использовать state

Если кратко, то - большинство ваших компонентов stateless. Есть такой паттерн controller-view: обычно у вас есть несколько компонентов-контроллеров на верхних уровнях дерева у которых есть свой state, а остальные компоненты просто принимают props и рендерят их.