在您的情况下，您需要处理回调。回调是响应中的一个概念。

在orders.js中声明一个事件处理程序函数，该函数将orderId设置为单击orders.js组件中的按钮时的状态，并将该事件处理函数作为道具传递给Order组件，并将orderId作为道具传递给OrderViewer组件

orders.js

  constructor(props){
      super(props);
      this.state = {
           orderId: null
      }
  }
  handleViewOrder = orderId = {
      this.setState({
          orderId
      });
  }
  render(){
    return(<div>
     <div><Order 
       orderno='abc'
       title='abc'
      status='abc'
      entity='abc'
      po='abc'
      duedate='abc' handleViewOrder={this.handleViewOrder} /></div>
  </div>
  <div><OrderViewer orderId={this.state.orderId} /></div>)}

现在，在order.js中，使用prop访问接收到的处理函数，并通过传递orderId将其分配给onClick按钮

   <div>
      <button onClick={() => this.props.handleViewOrder(this.props.orderno)}>View Order</button>
      <p><span>{this.props.orderno}</span> 
     <span>{this.props.title}</span></p>
     <p>{this.props.entity} - {this.props.po}</p>
     <p>Due {this.props.duedate}</p>
 </div>

现在，您可以在OrderViewer组件中使用this.props.orderId访问orderId并显示它

OrderViewer.js

   <div>{this.props.orderId}</div>

因此，在父组件中具有事件处理函数，并将其作为道具传递给子组件，然后将其分配给子组件按钮onClick，并在单击时更改父状态，这称为react中的回调。如果您了解我要在答案中解释的内容，则可以轻松进行

编辑：

在Order.js组件中

更改

  <button onClick={() => this.handleViewOrder(this.props.orderno)}>View Order</button>

至

   <button onClick={() => this.props.handleViewOrder(this.props.orderno)}>View Order</button>

另外，您正在循环调用Order组件，但没有为Order组件设置唯一键，因此

更改

            { Orders.map((order) => <Order 
                 orderno={order.orderno}
            title={order.title}
                 status={order.status}
                entity={order.entity}
                po={order.po}
            duedate={order.duedate}
            handleViewOrder={this.handleViewOrder}/> )}

至

            { Orders.map((order) => <Order 
            orderno={order.orderno}
            title={order.title}
            status={order.status}
                entity={order.entity}
            po={order.po}
                            key={order.orderno}
            duedate={order.duedate}
            handleViewOrder={this.handleViewOrder}/> )}