0
<Parent> /* event to fetch all refs value and submit */
  <Child>
     <stateless function />/*this is all the refs sittin*/
  </Child>
</Parent>

i don't know how parent can get all refs from the child ? Thanks in advance

marc_s
  • 732,580
  • 175
  • 1,330
  • 1,459
Denny Rachmadi
  • 163
  • 1
  • 3
  • 15

1 Answers1

1

I know it's perhaps too late and you already knew the answer. What you need is a "ref", a reference to the children. Read this: Exposing DOM Refs to Parent Components

Something like this:

class Parent extends React.Component {
  render() {
    return (
      <div>
        // this line will create a reference to the input text,
        // inside the Child Component
        // for example, if you want to get the value 
        // you can access `this.input.value`
        <Child inputRef={(refToChild) => this.input = refToChild} />
      </div>
    )
  }
}

class Child extends React Component {
  render() {
    return (
      <form>
        // this line will call the Parent's function,
        // creating a reference to the input text.
        <input type="text" ref={props.inputRef} />
      </form>
    )
  }
}
Win
  • 2,083
  • 2
  • 11
  • 14