Как передать state в виде props?

Question

[testkeyc]

Есть два файла App и App2. Как передать state из одного файла в другой в качестве props b вывести его на страницу?

Answer 1

[Егор Живагин]

Ну, в компоненте-родителе рендерить второй компонент, прокинуть ему пропс. Что не получается-то?

Comments

[testkeyc]

можете привести пример? Проблема в том, что через index.js получается все сделать, вывести через app уже нет

[Егор Живагин]

testkeyc, а можешь в этой песочнице - ссылка - пример выложить, что не получается? А то я, возможно, не правильно проблему понимаю

Answer 2

[hzzzzl]

class Parent extends React.Component {
  state = { c2: null }

  comp2state = state => { this.setState({ c2: state }) }

  return (
    <>
      <ComponentOne c2state={this.state.c2} />
      <ComponentTwo onStateChange={this.comp2state} />
    </>
  )
}


class ComponentTwo extends React.Component {
  state = { bla: '' }

  onChange = e => {
    this.setState(
      { bla: e.target.value }, 
      () => this.props.onStateChange(this.state)
    )
  }

  return (
    <input value={this.state.bla} onChange={onChange} />
  )
}