nuxt 设置路由的meta属性,nuxt 怎么设置路由的meta,nuxt 怎么设置router的meta

一个问题,想了好多种办法,终于用了一个笨方法解决了这个问题

如下所示:

routes.js 如下:

/**
 * nuxt的路由菜单配置
 * @description 仅仅只用于侧边栏的菜单显示和权限,其它的不做任何功能
 */
const menus = [{
        meta: {
            requireAuth: false, //菜单权限
            title: '系统首页', //菜单名
            icon: 'fa fa-bar-chart', //菜单图标
        },
        path: "/dashboard",
        name: "dashboard",
    },
    {
        meta: {
            requireAuth: false, //菜单权限
            title: '欢迎页', //菜单名
        },
        path: "Welcome",
        name: "dashboard-Welcome"
    },
    {
        meta: {
            requireAuth: false, //菜单权限
            title: '示例功能', //菜单名
            icon: 'fa fa-bar-chart', //菜单图标
        },
        path: "/demos",
        name: "demos",
    },
    {
        meta: {
            requireAuth: false, //菜单权限
            title: '列表Demo', //菜单名
        },
        path: "List",
        name: "demos-List"
    },
    {
        meta: {
            requireAuth: false, //菜单权限
            title: '列表详情', //菜单名
        },
        path: "List/Detail/:id?",
        name: "demos-List-Detail-id"
    },
    {
        meta: {
            requireAuth: false, //菜单权限
            title: '数据分析', //菜单名
            icon: 'fa fa-bar-chart', //菜单图标
        },
        path: "/datas/UserAnalysis",
        name: "datas-UserAnalysis"
    },
    {
        path: "/",
        name: "index"
    }
];


/**
 * 递归查询路由权限
 * @param {*} list
 * @param {*} menu
 */
const iterator = (list) => {
    for (let item in list) {
        for (const m in menus) {
            if ((list[item].name === menus[m].name) && (list[item].path === menus[m].path)) {
                console.log((list[item].name === menus[m].name) && (list[item].path === menus[m].path));
                list[item].meta = menus[m].meta;
                list[item].meta.requireAuth = true;
            }
        }
        if (list[item].children && list[item].children.length > 0) {
            iterator(list[item].children);
        } else {
            return list;
        };
    }
};

export default (routes, resolve) => {
    routes = iterator(routes);
    console.log(routes);
};

然后设置nuxt.config.js

nuxt.config.js 如下配置:

    router: { //中间件允许您定义一个自定义函数运行在一个页面或一组页面渲染之前。
        middleware: ['authorities'],
        extendRoutes: routes
    },

这个问题暂时得到了解决,可以根据routes生成标签导航/侧边栏菜单/面包屑导航等: