左侧菜单数据获取并渲染

MagnumHou 2023-01-13 03:23:04

课时名称	课时知识点
左侧菜单数据获取并渲染	左侧菜单数据获取并渲染

...全文

91 回复打赏收藏转发到动态举报

写回复

回复

切换为时间正序

请发表友善的回复…

发表回复

主要为大家详细介绍了layui递归实现动态左侧菜单，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

声明：这里非常感谢闲心大神，开源了非常好用的前端UI框架，layui，如有侵权请联系我。当然闲心在2.0版本的layuiAdmin已经支持了，不过是收费版的，需要的同学可以自行购买，网址：http://www.layui.com/admin/pro/ 本人在做管理后台事用到了左侧的导航列表，但是管理后台进来的菜单是根据不同账户的权限，显示不同的菜单。这时候需要动态的渲染左侧的列表。但是1.0版本只是更新到2级菜单，不满足如下图的3级菜单需求，只能自己动手，改造源码话不多说，上代码： 1.html部分，我需要一个容器用于渲染菜单 <div class="layui-side layui-b

Ztree+treeTable实现 Java实现树形菜单树形表格有丰富的实例和官方开发文档，也有官方api 不懂的可以查询官方api，实现很简单，按照实例做就可以

21、主页：通过双层for循环渲染左侧菜单外层for循环用来渲染一级菜单，内层渲染for循环用来渲染二级菜单。在一级菜单里添加v-for指令，再提供唯一的key属性。key值有id就用id。这时候出现了五个“导航栏一”，文本都是写死的，把每个item项对应的authname属性当作名称，给span标签动态绑定名称{{item.authName}}，这样，五个菜单就都渲染出来了。但是展开一个菜单，其他四个也都展开了。此时，需要给这个一级菜单指定唯一的index值，按照正常逻辑，每一个菜单都有独属于自己

接上篇《16、主页Header和左侧菜单栏布局》上一篇我们编写了头部Header和左侧菜单栏的布局样式，本篇我们来通过接口获取菜单数据，并重新加载菜单至左侧菜单栏。一、获取菜单数据的权限我们需要通过接口获取菜单数据，而菜单必须是在登录之后才能访问的，所以未登录前直接访问菜单接口是会被拒绝。那么登录之后又如何让接口认定前端已有权限获取数据了呢？我们回顾一下API文档中的注意事项：即我们获取需要授权的API的数据时，必须将我们登录时获取的token令牌，封装到http请求头的Authorizatio

橙汐工作室

3

社区成员

332

社区内容

发帖

与我相关

我的任务

vue.js前端框架html5 企业社区天津·河西区

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

核心使命：为IT从业者和技术爱好者提供一个优质的学习、交流和分享平台，促进技术创新和成长。
注意事项：请保持尊重、友善的交流环境，遵守社区规则，禁止发布违法、侵权、低俗或有害信息。
激励机制：为了鼓励积极参与社区的用户，我们会设置积分和勋章系统，支持高质量的原创内容和有益的互动。
感谢您的加入，期待与您一起在CSDN社区共同探索技术，交流经验，共同成长！

试试用AI创作助手写篇文章吧

+ 用AI写文章