I have a Truck component that renders a truck's name from an object that obejct contains the name of the truck and the orders assigned to it, and I have another object with the order's and the date they should be fulfilled. So far my components look like below. The truck component renders every truck in the object and can be filtered via an input. My goal here is to render the orders according to the search and render the due date "from-to" so 2 dates in the Order component. How could I take the assignedOrderId from the TrucksContext and search by that in the OrderContext and return the Id and 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;
question from:
https://stackoverflow.com/questions/65848966/react-object-and-array-iteration 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…