Question

我有两个组成部分，

组件：

DeveloperComponent
启动器组件

首先调用Launcher Component，然后单击按钮将其路由到Developer组件。我想将值从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值。请在这种情况下帮助我。

Answer 1

您可以使用这样的路由功能发送数据，

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

将数据传递回React JS中的组件

1 个答案: