reactjs - 将数据传回 React JS 中的组件
问题描述
我有2个组件,
成分:
- 开发者组件
- 启动器组件
在此,Launcher 组件首先被调用。从该按钮单击它路由到 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>
);
}
}
开发者.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 值。请帮我解决这个问题。
解决方案
您可以使用这样的路由功能发送数据,
this.props.history.push({pathname:'/',url:this.state.url})
推荐阅读
- python - 如何将 jupyter Notebook 与其他网站一起托管为子目录
- matlab - 如果与表格匹配,则更改矩阵中的值
- django - 如何解决pyinstaller可执行文件导入错误“异常值:类型对象'spacy.syntax.nn_parser.array'没有属性'__reduce_cython__'”?
- pandas - 如何在给定另一个变量的列中分配一个变量?
- java - 删除最后一个字符时如何使按钮一个一个可见
- ruby - 如何使用 Appium、Ruby 在 RecyclerView 中单击上下文
- sql-server - 由于日期格式无效,SSIS 包中的派生列出错。如何跳过这样的值?
- java - 有没有办法通过 Intent 或其他方式共享 *.json 文件?
- excel - 删除行时如何防止公式更改
- sparql - 列结果意外返回什么