类型错误：product.features.map 不是函数

Question

  const [featureRatings, setFeatureRatings] = useState(() =>
    product.features.map((feature: { category: any }) => ({
      category: feature.category,
      rating: 0, // Default rating value
    }))
  );
const [processLifecycleRatings, setProcessLifecycleRatings] = useState(
 

在此输入图片描述

帮我弄清楚这里发生了什么

Answer 1

错误 TypeError: Product.features.map is not a function 表示 Product.features 不是数组，因此无法对其调用 .map() 方法。如果 Product.features 未定义、为 null 或任何不是数组的值（如对象或字符串），则可能会发生这种情况。

要解决此问题，您应该在调用 .map() 之前确保 Product.features 是一个数组。

在调用.map()之前检查product.features是否为数组：

   const [featureRatings, setFeatureRatings] = useState(() =>
    Array.isArray(product.features)
        ? product.features.map((feature: { category: any }) => ({
            category: feature.category,
            rating: 0, // Default rating value
          }))
        : [] // If not an array, use an empty array as a fallback
    );

条件渲染或默认道具：您还可以使用条件渲染或默认道具来确保在使用 .map() 之前product.features始终是一个数组：

常积 = { 特点：产品.特点 || [] // 如果功能未定义则回退到空数组 };

const [featureRatings, setFeatureRatings] = useState(() =>
  product.features.map((feature: { category: any }) => ({
    category: feature.category,
    rating: 0,
  }))
);