How to get value from this.state in another React component?

Question

JavaScript

Hey!
I have a form in it there is a component, in this component, under certain conditions, setState occurs in the resulting array. Now I will write down the Submit button and I want to pick up this array to send it to the server.
How can I take this state?
PS Of course, I can put the received information in the value for my component and then pick up the value - it's easy, but what if there is a lot of information or an object in general, then this is not quite the right option

Answer 1

If submit is in the same component, we simply take the values ​​from the state.
If in another (one level higher, it turns out, or several), then you need from the component, when changing, call the callback function (which will be passed as props), inside which the change in the parent state will be called and then on submit you can easily you will be able to take a ready-made state
Code example:

Component A

state = {
  fromSuperComponent: '123',
}

callMeHandle = (e) => {
  this.setState({
    fromSuperComponent: e.currentTarget.value,
  })
}

render() {
  return (
    <form>
      <input type='text' value='test'/>
      <SuperComponent callMeWhenDataChanged={this.callMeHandle} value={this.state.fromSuperComponent} />
    </form>
  )
}

SuperComponent

render() {
  <input type='text' value={this.props.value} onChange={this.props.callMeWhenDataChanged} />
}