我如何錯誤地導出我的 object？

Question

我想知道我是如何錯誤地導出我的 object 的？ 在我看來，我看到了這個錯誤：./src/ ./src/context.js Attempted import error: 'detailProduct' is not exported from './data'.

在控制台中，我確實看到對象被正確填充，但由於上述錯誤，由於某種原因，它不會呈現我的視圖。 我究竟做錯了什么？

export const storeProducts = [
  {
    id: 1,
    title: "Crusk Beanie (black)",
    img: "img/CruskipBlackBeanie.png",
    price: 1,
    company: "Cruskip",
    info:
        "Winter's right around the corner, get your beanie today!",
    inCart: false,
    count: 0,
    total: 0
  },
  {
    id: 3,
    title: "Cruskip Short Sleeve T-shirt",
    img: "img/CruskipWhiteShortSleeve.jpg",
    price: 8,
    company: "Cruskip",
    info:
        "Exclusive Cruskip white t-shirts!",
    inCart: false,
    count: 0,
    total: 0
  },
];

let detailProduct = {};

storeProducts.forEach((arrayItem) => {
  detailProduct = {
    id: arrayItem.id,
    title: arrayItem.title,
    img: arrayItem.img,
    price: arrayItem.price,
    company: arrayItem.company,
    info: arrayItem.info,
    inCart: arrayItem.inCart,
    count: arrayItem.count,
    total: arrayItem.total
  };
  console.log(arrayItem);
});

export default detailProduct;

Answer 1

您可能會使用大括號導入它，但對於default導出，您不能這樣做：

// This will work
import detailProduct from './data';

// This won't
import { detailProduct } from '.data';

另一方面，由於storeProducts是一個命名導出，它的工作方式相反：

// This will work
import { storeProducts } from './data';
// This won't
import storeProducts from './data';