反应对象和数组迭代

问题描述

我有一个 Truck 组件，它从一个对象呈现卡车的名称，该对象包含卡车的名称和分配给它的订单，我还有另一个对象，其中包含订单和它们应该履行的日期。到目前为止，我的组件如下所示。卡车组件渲染对象中的每辆卡车，并且可以通过输入进行过滤。我的目标是根据搜索呈现订单并在订单组件中呈现截止日期“从到”，因此有 2 个日期。如何从 TrucksContext 中获取assignedOrderId并在OrderContext中搜索并返回Id和from-to？

   const Truck = (props) => {
  const { name,orders } = props;

  return (
    <div className='outer'>
      <div className='nameHolder'>
        <p>{name}</p>
      </div>

      <div className='orderHolder'>
        <OrdersProvider>
          <Order orderName={orders} />
        </OrdersProvider>
      </div>
    </div>
  );
};

export default Truck;

    const Orders = (props) => {
  const { orderName } = props;
  const [orders,setorders] = useContext(OrdersContext);

  console.log(`This is the order1: ${orderName}`);
  console.log(orders);

  const filteredOrders = orders.filter((order) => {
    return order.id.includes(orderName.assignedOrderId);
  });

  console.log(filteredOrders);

  return (
    <div className='outer'>
      <p>{orderName}</p>
    </div>
  );
};

export default Orders;

解决方法

这就是解决方案

window.location.href = 'index.html' + $(this).attr('href');