Question

我有一个链接表（共5个）。

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

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

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

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

示例：state.data.item.statics.footerLinks

footerLinks是一个对象数组：

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

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

即const { footers } = state.data.item.footerLink;

问题是我还需要在检查后将页脚映射到“名称”键更改为“链接”（如果存在）。如果不存在，我需要立即在映射之前停止代码，因为我不能映射null或undefined。它将引发错误。如果没有footerLinks，我仍然想不出如何阻止代码到达地图，而仍然给我3个静态链接以显示在UI中。这是我到目前为止的内容：

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

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

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

****如果存在footerLinks，我想分配给const footer。如果它们不存在，我需要终止该过程，以免我们到达地图****

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

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

const allLinks = shopLinks.concat(mainLinks);

Answer 1

如果不适合您的用例，为什么要坚持使用map，请使用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);

如何检查数据并停止执行（如果不存在）？

1 个答案: