在 ReactJs 中使用条件解构的更有效方法

Question

我有这段代码，我们可以在其中检索数据或使用 useQuery 获取数据。但是，每当我尝试使用此方法调用它时，它都会失败。

const { data: {getSubCategories} } = useQuery(FETCH_SUBCATEGORIES_QUERY);

似乎抛出一个错误，指出 'getSubCategories' 未定义，所以我尝试了这个方法：

const { getSubCategories: subCategories } = { ...subCategoryData };
const { getChildCategory } = { ...data };

它有效，但我认为有更好的方法或更有效的方法来使用条件语法来解构某些东西，所以它不能 return undefined 我想我似乎注意到它需要几秒钟它将 return 数据。

如果您不明白我想说什么或需要更多说明，请在下方评论。谢谢。

Answer 1

如果我没理解错你可以试试这个：（安全地从对象中销毁）

const { data: {getSubCategories} } = useQuery(FETCH_SUBCATEGORIES_QUERY) || {};

Answer 2

It appears to throw an error stating that 'getSubCategories' is undefined

不，当 data 为 undefined 时会抛出错误。您可以使用默认值来规避它：

const { data: {getSubCategories} = {} } = useQuery(FETCH_SUBCATEGORIES_QUERY);

More Efficient Way to Destructure with Conditional in ReactJs