CODEWITHSUNDEEP
reactjsreact-nativereact-navigation
Firas Abu Fares
Firas Abu Fares

Reputation: 551

react native how get variable from reusable component

i want to reuse this component

render() {
    return (



        <SelectionGroup
            renderContent={this.renderButton}
            items={this.props.items}
            onPress={this.selectionHandler.selectionHandler}
            isSelected={this.selectionHandler.isSelected}
            containerStyle={styles.answers}
            onItemSelected={(item) => this.setState({ selectedAnswer: item.value })}
        />



    );}

from home screen i manage to send the items to selection group

import Selection from './selectionGroup'

      <Selection
      items={cofeeType.options}
      />

my problem is i don't know how to get back the selectedAnswer from the reusable component

Upvotes: 0

Views: 210

Answers (1)

Aurangzaib Rana
Aurangzaib Rana

Reputation: 4252

you have to send a call back for setting value of your parent state

constructor(props){
  super(props)
  this.state={
    answers=[]
  }
}

handleAnswers=(answers)=>{
  this.setState({answers})
}

      <Selection
      handleAnswers={this.handleAnswers}
      items={cofeeType.options}
      />

in Component handle the callback

handleValue=(answers)=>{
  const {handleAnswers}=this.props;
  handleAnswers(answers)
  this.setState({ selectedAnswer: item.value });
}

render() {

  return (



      <SelectionGroup
          renderContent={this.renderButton}
          items={this.props.items}
          onPress={this.selectionHandler.selectionHandler}
          isSelected={this.selectionHandler.isSelected}
          containerStyle={styles.answers}
          onItemSelected={this.handleValue}
      />



  );}

Upvotes: 1

Related Questions