Javascript 如何在react中将状态值从父元素传递给子元素

在我的代码中，我有一个选项卡菜单，我想用一个按钮在这些选项卡之间切换。我想将这些选项卡的值传递到按钮的onclick函数中，以便它可以在选项卡之间导航

例如：

<Tabs value={this.state.value} onChange={this._handleChange}>
     <Tab label="1" value={1}>
         <RaisedButton label="Next" onTouchTap={this._handleChange} />
     </Tab>
     <Tab label="2" value={2}>
         <RaisedButton label="Next" onTouchTap={this._handleChange} />
     </Tab>
     <Tab label="3" value={3}>
         <RaisedButton label="Next" onTouchTap={this._handleChange} />
     </Tab>
</Tabs>

我需要以某种方式将onTouchTap事件与来自main tabs元素的onChange事件链接起来，但我不确定如何做到这一点。我的主要目标是在三个可用选项卡之间导航：单击tab1上的next按钮时，它将切换到tab2，然后切换到tab3，最后返回到tab1

---

有人知道我怎样才能做到吗？如果这些元素看起来是外来的，我也会使用material UI。

您可以这样做：

<Tabs value={this.state.value} onChange={this._handleChange}>
     <Tab label="1" value={1}>
         <RaisedButton label="Next" onTouchTap={this._handleChange.bind(this, 2)} />
     </Tab>
     <Tab label="2" value={2}>
         <RaisedButton label="Next" onTouchTap={this._handleChange.bind(this, 3)} />
     </Tab>
     <Tab label="3" value={3}>
         <RaisedButton label="Next" onTouchTap={this._handleChange.bind(this, 1)} />
     </Tab>
</Tabs>

---

虽然siu应答是正确的，但要注意setState（）是一个异步调用

您的

console.log

this.setState({
  value: value,
});

输出可能与您预期的不同

this.setState({
  value: value,
});