Как передать состояние родительского компонента в дочерний?

Question

[Игорь]

Как передать состояние родителя в дочерний компонент?

Answer 1

[Роман Александрович]

<Children state={this.state}>

Comments

[Игорь]

это при рендеринге компонента в родительский?
А что должно быть в дочернем компоненте. Как выглядеть будет код??

class Children extends Component {
constructor(props) {
super(props);

this.state = props..... ??? как тут будет?
}
}

[Роман Александрович]

Игорь,
папробуйте так

class Children extends Component {
constructor(props) {
    super(props);
    let state = this.props.state
    console.log("state",state)
    }
}

[Антон Спирин]

Игорь, не надо так делать. Если дочерний элемент получает state от родителя, то менять его он должен через колбек, так же передаваемый от родителя.

[Роман Александрович]

Антон Спирин, ну тут была прозьба просто передать значение а не написать функцию которая будет передавать значение и изменять стейт сына

[Антон Спирин]

Роман Александрович, я ответил Игорю, что не надо делать так:
this.state = this.props.state;
По вашему примеру ничего не комментировал. Разве хочется сказать, что лучше использовать const, а не let для неизменяемых значений. Повышает читаемость кода. Особенно если он сложный.

[Роман Александрович]

Игорь,
это если вам нужна прям функция

class Father extends Component {
constructor(props) {
    super(props);
  }

changeStateChilren(){
    this.refs.chilren.setValue("need value")
}

render(){
   return(
    <Children ref="chilren">
   )
}
}




class Children extends Component {
constructor(props) {
    super(props);
    }


setValue(val){
   console.log("val from father",val)
}
}

[Игорь]

Антон Спирин, Да, будет функция кот будет менять значение, только я думал что при изменении состояния родителя, дочерний поменяется тоже. Запутался уже(((

[Роман Александрович]

Игорь, ну вы правильно думали
изменится стейт произойдет рендер и значение нового стейта передастся потомку
просто функцию использовать нужно тогда когда вам не нужно тащить прям весь стейт родителю а надо только несколько переменных или нужно изменить значение стейта потомка

[Игорь]

Роман Александрович, Спасибо всем огромное за ответы!!

[Роман Александрович]

Игорь, мне хватит того что вы кликните по кнопке правильный ответ) не за что