根据后端数据在前端遍历生成导航栏（递归）

最新推荐文章于 2022-05-04 13:59:50 发布

原创

最新推荐文章于 2022-05-04 13:59:50 发布 · 2.4k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#交流

本文介绍了如何根据后端提供的数据，在前端利用递归方式生成导航栏。涉及数据库表格设计，其中父级ID用于实现递归关系。接着详细讲述了Models层、Controllers层和Views层的实现过程，并提供了JQuery代码示例。作者欢迎读者提出反馈，以完善文章内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

数据库表格设计

模块表数据（递归）：

列名	数据类型	允许Null值	备注
ModularID	int	False	模块ID
ModularFatherId	int	False	模块父级ID
ModularPrefix	varchar(200)	True	模块前缀
ModularName	varchar(200)	False	模块名称（英）
ModularSuffix	varchar(200)	True	模块后缀
ModularRemarks	varchar(200)	False	模块备注
ModularLink	varchar(200)	True	模块链接
EnableNo	bit	False	是否启用

父级ID主要用于递归例如：

在这里插入图片描述

Models层

略过

Controllers层

        /// <summary>
        /// 查询树形结构数据
        /// </summary>
        /// <param name="FatherId">父级id</param>
        /// <returns></returns>
        public ActionResult QueryTreeData(int FatherId)
        {
            var linqModularData = (from S_Modular_Table in MyEastAirlinesElectronicTicketSystemEntit