javascript - 如何在反应打字稿应用程序中修复“500 TypeError：无法读取属性'split' of null”

Question

我正在尝试解决此错误：

我在挠头，因为第 60 行没有拆分语句：

Line 60: @import 'vars';

我看到的唯一拆分语句是：

const components = product.pid.split(URL_COMPONENT_SEPARATOR).filter((x) => x !== product.productId);

在 ProductCard.tsx 的第 26 行。这可能是什么原因？

标签： javascriptreactjs

Answer 1

这可能是由于第一次渲染组件pid时未初始化产品上的字段。ProductCard

这通常是由于您的后端提供的数据不完整，或者因为您的组件在网络请求之前或期间呈现以获取您的组件的数据（即在这种情况下product）

考虑为您提供的代码提供一种防御方法来解决此问题，如下所示：

const components = typeof product.pid === 'string' ? product.pid.split(URL_COMPONENT_SEPARATOR).filter((x) => x !== product.productId) : [];