首页 > 解决方案 > 如果数据不存在,如何检查数据并停止代码执行?

问题描述

我有一个链接表(总共 5 个)。

链接1 链接2 链接3 链接4 链接5

前 2 个链接是动态的。有时有他们的数据,有时没有。

最后 3 个链接是静态的,并且始终显示。

动态链接的数据深深地嵌套在状态中。

例子:state.data.item.statics.footerLinks

footerLinks 是一个对象数组:

footerLinks [{name: "****",url: "****"},{name: "****",url: "****"}]

仅当存在 footerLinks 时,我才需要解构 state.props 对象以获取 footerLinks。

IEconst { footers } = state.data.item.footerLink;

问题是我还需要在检查后映射页脚以将“名称”键更改为“链接”(如果存在)。如果它不存在,我需要在映射之前立即停止代码,因为我无法映射 null 或 undefined。它会抛出一个错误。如果没有 footerLinks 并且仍然给我 3 个静态链接以在 UI 中显示,我无法弄清楚如何阻止代码到达地图。这是我到目前为止所拥有的:

这些是始终存在的静态链接:

const mainlinks = [ {label: "*******", url: "********"},{label: "*******", url: "********"},{label: "*******", url: "********"}];

**** 检查页脚链接 ****

**** 如果存在 footerLinks 我想分配给 const 页脚。如果它们不存在,我需要终止该过程,这样我们就无法到达地图****

****如果存在footerLinks,则映射页脚以将名称更改为标签****

const shopLinks = footers.map((footer) => ( return {label: footer.name, url: footer.url } )

const allLinks = shopLinks.concat(mainLinks);

标签: javascriptreactjstypescript

解决方案


如果不适合您的用例,为什么要坚持使用地图,请使用 forEace 而不是如下所示...

const { footers = [] } = state.data.item.footerLink;
let dynamicLinkHolder = []
const shopLinks = footers.forEach((footer) => (
 if(footer){
    dynamicLinkHolder.push({label: footer.name, url: footer.url })
  }
)
const allLinks = shopLinks.concat(dynamicLinkHolder);

推荐阅读