打字稿查找和过滤功能对象可能是“未定义”错误

Question

const [value, setValue] = React.useState(
    options.find(opt => opt.id == valueId) && options.find(opt => opt.id == valueId).title,
);

我该如何解决这个问题？

Answer 1

您看到此错误的原因，因为如果没有元素匹配，则 find 可能返回 undefined。您可以使用可选链接来摆脱它：

TS Playground link

const [value, setValue] = React.useState(
    options.find(opt => opt.id == valueId)?.title,
);

Typescript 不跟踪表达式，因此您的 && 左侧不会在右侧被考虑在内。

---

既然你不喜欢换行，就这样做：

const initialValue = options.find(opt => opt.id == valueId)?.title;
const [value, setValue] = React.useState(initialValue);

Answer 2

这个使用解决了vsCode格式问题