Блог

введите описание изображения здесь

 import React,{ useContext } from "react";
import "./OrderList.css"
import UserContext from "../Context/Context";
import { useState } from "react";
import {useEffect} from 'react';
const OrderList=(props)=>{
  const [TotalPrice,SetPrice]=useState(0);
  const Value=useContext(UserContext);
  const [fl,setfl]=useState(false);  
  const [data,setdata]=useState(Value.listItems);
  const [item,setitem]=useState(Value.items);
            const priceupdate=(data)=>{
                let price=0;
                 for(var x in data){
                    price =data[x].Price;
                  }
                  SetPrice(price);
            }    
            if(Value.run===true){
               priceupdate(data);
               let len=data.length;
               var x=0;
               let array=[];
               Value.run=false;
            }
            const removelist=(e)=>{
                const id=parseInt(e.target.parentNode.parentNode.parentNode.id);
                console.log(id);
                let p=Value.listItems[id];
                p=p.index;
                SetPrice(TotalPrice);
                Value.listItems=Value.listItems.filter((item)=> item.id!==id)
                setdata(Value.listItems);
                Value.items=Value.items-1;
                props.setitem(Value.items);
            }
//  const obj={
//         Dish:value.Dish,
//         items:item,
//         Additems:()=>{},
//         listItems:data,
//         run:fl,
//     }

    return(
    <div className="Container">
       {props.flag ? data.map((item,index)=>
                    <ul className="ContainerList" id={item.id} key={index}>
                    <div className="containerInner">
                        <li>{item.Name}</li>
                        <li>{item.Price}</li>
                        <div className="addcontainer">
                        <li className="minus" onClick={removelist}>-</li>
                        <li className="plus"> </li>
                        </div>
                    </div>
                </ul>
        ):<h3>Please AddToList</h3>}
        {props.flag amp;amp;  <p className="TPrice">{"Total Price:" TotalPrice}</p>}
    </div>)
}
export default OrderList;
 

….
Когда я получаю данные через массив объектов, он показывает эту ошибку, в противном случае индекс определяется, и иногда во время цикла он показывает эту ошибку

[Изображение одно показывает страницу с ошибкой][2] [2]: https://i.stack.imgur.com/Chpaj.png [Отправить код данных в другой список заказов ][2]