[英]Need help creating a dynamic navigation menu
I'm creating an app for wireframing apps.我正在为线框图应用程序创建一个应用程序。 I'm working on a function for generating links from the data of the wireframed app which will consist on an unpredictable amount of sections within sections.
我正在研究 function,用于从线框应用程序的数据中生成链接,这些链接将包含部分内不可预测的部分。 The interface for the sections are shaped like this
各部分的界面形状如下
export interface ProjectObject{
title: string;
link?: string;
summary?: string;
description?: DescriptionPoint[];
sections?: ProjectObject[];
elements?: ProjectElement[];
challenges?: ProjectChallenges[];
feedback?: ProjectFeedbackItem[];
}
What I want to do is extract the title
and link
properties from each object and store it in a variable shaped like this我想要做的是从每个 object 中提取
title
和link
属性并将其存储在一个形状像这样的变量中
export interface NavLink{
title: string;
link: string;
subLinks?: NavLink[]
}
The title and link properties are of course the properties to be extracted from each object.标题和链接属性当然是要从每个 object 中提取的属性。 The
subLinks
property is for saving nested links to be retrieved from the additional sections in the sections
property. subLinks
属性用于保存要从 section 属性中的其他sections
检索的嵌套链接。
I came up with the following function in an attempt to extract and form the links我想出了以下 function 试图提取和形成链接
createProjectLinks(data: ProjectObject[]){
return data.map(a=>{
let links: NavLink = {
title: a.title,
link: a.link,
subLinks: this.createProjectLinks(a.sections)};
return links;
});
}
When passing an array of ProjectObject
s into it I get the following error将
ProjectObject
数组传递给它时,出现以下错误
ERROR TypeError: Cannot read property 'map' of undefined
错误类型错误:无法读取未定义的属性“地图”
at first I thought it was an async issue but I created a const
directly above the component to serve as dummy data to avoid asyncrounous problems and I'm still getting the same error passing the dummy data into the function.起初我认为这是一个异步问题,但我在组件正上方创建了一个
const
作为虚拟数据以避免异步问题,并且我仍然遇到同样的错误,将虚拟数据传递到 function。 What am I doing wrong?我究竟做错了什么? Is there a better way for me to achieve this functionality?
我有更好的方法来实现这个功能吗?
The below error is not a typescript issue, but a javascript issue以下错误不是 typescript 问题,而是 javascript 问题
TypeError: Cannot read property 'map' of undefined
do this做这个
createProjectLinks(data: ProjectObject[] = []){ //give default value of [] to prevent mapping on undefined data
return data.map(a=>{
let links: NavLink = {
title: a.title,
link: a.link,
subLinks: this.createProjectLinks(a.sections)};
return links;
});
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.