Передать данные обратно компоненту в React JS - PullRequest
Новая
       14

Передать данные обратно компоненту в React JS

0 голосов
/ 02 ноября 2018

У меня 2 компонента,

Компоненты:

  • DeveloperComponent
  • Компонент запуска

При этом компонент Launcher вызывается первым. После нажатия на кнопку он направляется к компоненту разработчика. Я хочу передать значение обратно из компонента Developer в компонент Launcher. 

  class LauncherApp extends Component {
      constructor(props) {
        super(props);
        this.developerMode = this.developerMode.bind(this)
      }

    developerMode(){
        this.props.history.push('/dev') //routes to developer component
       }

    render() {
       return (
    <div>
             <List>
                <ListItem
                onClick={this.developerMode}>Developer<ListItem/>
             </List>
    </div>
     );
  }
      }

Developer.js 

    class DeveloperMode extends Component {
          constructor(props) {
            super(props);
            this.handleChange = this.handleChange.bind(this);
            this.handleSubmit = this.handleSubmit.bind(this);
               this.state = {
                  url:'Prod'
                };
          }

           handleChange(event) {
            this.setState({
              url: event.target.value
            });
          } 
            handleSubmit(event) {
            event.preventDefault();
            var env=this.state.url;
              this.props.signOut();
             }

render() {
      return(
        <div>
          <h3>Select Environment </h3>
        <RadioButtonGroup name="selectURL" defaultSelected="Prod"  onChange={this.handleChange}>
          <RadioButton
            value="Prod"
            label="Production"

          />
          <RadioButton
            value="Dev"
            label="Development"

          />
          <RadioButton
          value="Test"
          label="Testing"

        />
        </RadioButtonGroup>
        <RaisedButton label="Save" onClick={this.handleSubmit}/>
        </div>
      );
    }
        }

Я хочу получить значение url в компоненте Launcher. Пожалуйста, помогите мне с этим сценарием.

1 Ответ

0 голосов
/ 02 ноября 2018

Вы можете отправлять данные с помощью функции маршрутизации, подобной этой, 

this.props.history.push({pathname:'/',url:this.state.url})
...