在ReactJS中的onClick事件上的選項卡之間傳遞值

Question

這是我正在研究的組件。 我有三個名為newOrder，currentOrder和orderHistory的選項卡。

當我按卡上的“接受”按鈕時，如何將“新訂單”選項卡中的卡移動到“當前訂單”選項卡。

export default class Driver extends Component {
  constructor(props, context) {
    super(props, context);
    this.state = {
      key: 'home',
    };
  }
  render() {
    return (
      <Tabs id="controlled-tab-example" activeKey={this.state.key} 
       onSelect{key => this.setState({ key })}>
       <Tab eventKey="newOrder" title="New Order">
        //this is the card with Accept button.
         <div class="card">
            <div class="card-body">          
            <Button type="button>Accept</Button>                     
            </div>
         </div>   
        </Tab>

        <Tab eventKey="currentOrder" title="Current Order"></Tab>

        <Tab eventKey="orderHistory" title="OrderHistory"></Tab>
      </Tabs>
    );
  }
}

Answer 1

這可以通過使用組件狀態來實現。 您可以參考以下鏈接： https ： //reactjs.org/docs/state-and-lifecycle.html