React项目引入FoodDisplay组件时触发解构属性运行时错误的求助
React项目引入FoodDisplay组件时触发解构属性运行时错误的求助
我正在开发一个React项目,项目里专门建了个assets文件夹,里面有个assets.js文件,我在其中定义了food_list数组。另外我写了FoodDisplay.jsx组件,在里面通过const引入了这个food_list数组,但当我尝试把FoodDisplay.jsx组件导入到Home.jsx中时,就触发了错误。
目前我整理出了assets.js的代码:
import basket_icon from './basket_icon.png' import logo from './logo.png' import header_img from './header_img.png' import search_icon from './search_icon.png' import menu_1 from './menu_1.png' import menu_2 from './menu_2.png' import menu_3 from './menu_3.png' import menu_4 from './menu_4.png' import menu_5 from './menu_5.png' import menu_6 from './menu_6.png' import menu_7 from './menu_7.png' import menu_8 from './menu_8.png' import food_1 from './food_1.png' import food_2 from './food_2.png' import food_3 from './food_3.png' import food_4 from './food_4.png' import food_5 from './food_5.png' import food_6 from './food_6.png' import food_7 from './food_7.png' import food_8 from './food_8.png' import food_9 from './food_9.png' import food_10 from './food_10.png' import food_11 from './food_11.png' import food_12 from './food_12.png' import food_13 from './food_13.png' import food_14 from './food_14.png' import food_15 from './food_15.png' import food_16 from './food_16.png' import food_17 from './food_17.png' import food_18 from './food_18.png' import food_19 from './food_19.png' import food_20 from './food_20.png' import food_21 from './food_21.png' import food_22 from './food_22.png' import food_23 from './food_23.png' import food_24 from './food_24.png' import food_25 from './food_25.png' import food_26 from './food_26.png' import food_27 from './food_27.png' import food_28 from './food_28.png' import food_29 from './food_29.png' import food_30 from './food_30.png' import food_31 from './food_31.png' import food_32 from './food_32.png' import add_icon_white from './add_icon_white.png' import add_icon_green from './add_icon_green.png' import remove_icon_red from './remove_icon_red.png' import app_store from './app_store.png' import play_store from './play_store.png' import linkedin_icon from './linkedin_icon.png' import facebook_icon from './facebook_icon.png' import twitter_icon from './twitter_icon.png' import cross_icon from './cross_icon.png' import selector_icon from './selector_icon.png' import rating_starts from './rating_starts.png' import profile_icon from './profile_icon.png' import bag_icon from './bag_icon.png' import logout_icon from './logout_icon.png' import parcel_icon from './parcel_icon.png' export const assets = { logo, basket_icon, header_img, search_icon, rating_starts, add_icon_green, add_icon_white, remove_icon_red, app_store, play_store, linkedin_icon, facebook_icon, twitter_icon, cross_icon, selector_icon, profile_icon, logout_icon, bag_icon, parcel_icon } export const menu_list = [ { menu_name: "Salad", menu_image: menu_1 }, { menu_name: "Rolls", menu_image: menu_2 }, { menu_name: "Deserts", menu_image: menu_3 }, { menu_name: "Sandwich", menu_image: menu_4 }, { menu_name: "Cake", menu_image: menu_5 }, { menu_name: "Pure Veg", menu_image: menu_6 }, { menu_name: "Pasta", menu_image: menu_7 }, { menu_name: "Noodles", menu_image: menu_8 }] export const food_list = [ { _id: "1", name: "Greek salad", image: food_1, price: 12, description: "Food provides essential nutrients for overall health and well-being", category: "Salad" }, { _id: "2", name: "Veg salad", image: food_2, price: 18, description: "Food provides essential nutrients for overall health and well-being", category: "Salad" }, { _id: "3", name: "Clover Salad", image: food_3, price: 16, description: "Food provides essential nutrients for overall health and well-being", category: "Salad" }, { _id: "4", name: "Chicken Salad", image: food_4, price: 24, description: "Food provides essential nutrients for overall health and well-being", category: "Salad" }, { _id: "5", name: "Lasagna Rolls", image: food_5, price: 14, description: "Food provides essential nutrients for overall health and well-being", category: "Rolls" }, { _id: "6", name: "Peri Peri Rolls", image: food_6, price: 12, description: "Food provides essential nutrients for overall health and well-being", category: "Rolls" }, { _id: "7", name: "Chicken Rolls", image: food_7, price: 20, description: "Food provides essential nutrients for overall health and well-being", category: "Rolls" }, { _id: "8", name: "Veg Rolls", image: food_8, price: 15, description: "Food provides essential nutrients for overall health and well-being", category: "Rolls" }, { _id: "9", name: "Ripple Ice Cream", image: food_9, price: 14, description: "Food provides essential nutrients for overall health and well-being", category: "Deserts" }, { _id: "10", name: "Fruit Ice Cream", image: food_10, price: 22, description: "Food provides essential nutrients for overall health and well-being", category: "Deserts" }, { _id: "11", name: "Jar Ice Cream", image: food_11, price: 10, description: "Food provides essential nutrients for overall health and well-being", category: "Deserts" }, { _id: "12", name: "Vanilla Ice Cream", image: food_12, price: 12, description: "Food provides essential nutrients for overall health and well-being", category: "Deserts" }, { _id: "13", name: "Chicken Sandwich", image: food_13, price: 12, description: "Food provides essential nutrients for overall health and well-being", category: "Sandwich" }, { _id: "14", name: "Vegan Sandwich", image: food_14, price: 18, description: "Food provides essential nutrients for overall health and well-being", category: "Sandwich" }, { _id: "15", name: "Grilled Sandwich", image: food_15, price: 16, description: "Food provides essential nutrients for overall health and well-being", category: "Sandwich" }, { _id: "16", name: "Bread Sandwich", image: food_16, price: 24, description: "Food provides essential nutrients for overall health and well-being", category: "Sandwich" }, { _id: "17", name: "Cup Cake", image: food_17, price: 14, description: "Food provides essential nutrients for overall health and well-being", category: "Cake" }, { _id: "18", name: "Vegan Cake", image: food_18, price: 12, description: "Food provides essential nutrients for overall health and well-being", category: "Cake" }, { _id: "19", name: "Butterscotch Cake", image: food_19, price: 20, description: "Food provides essential nutrients for overall health and well-being", category: "Cake" }, { _id: "20", name: "Sliced Cake", image: food_20, price: 15, description: "Food provides essential nutrients for overall health and well-being", category: "Cake" }, { _id: "21", name: "Garlic Mushroom ", image: food_21, price: 14, description: "Food provides essential nutrients for overall health and well-being", category: "Pure Veg" }, { _id: "22", name: "Fried Cauliflower", image: food_22, price: 22, description: "Food provides essential nutrients for overall health and well-being", category: "Pure Veg" }, { _id: "23", name: "Mix Veg Pulao", image: food_23, price: 10, description: "Food provides essential nutrients for overall health and well-being", category: "Pure Veg" }, { _id: "24", name: "Rice Zucchini", image: food_24, price: 12, description: "Food provides essential nutrients for overall health and well-being", category: "Pure Veg" } ]
提示:麻烦补充下控制台抛出的具体错误信息哦,比如是导入路径错误、解构时找不到属性,还是其他类型的错误,这样能更精准地帮你定位问题~
备注:内容来源于stack exchange,提问作者Sayak Ghosh
相关产品推荐
相关产品推荐

