vue路由动态增加组件渲染

做404页面路由使用hash可以使用 * 作为path 或者动态 /:id
但是 history 建议使用 /：id 作为404 重定向虽然 * 可以
但是最新版会报错

{
    path: '*',
    name: 'form',
    component: () => import(/* webpackChunkName: "about" */ '../views/404.vue')
  },

{
    path: '*',
    name: 'form',
    component: () => import(/* webpackChunkName: "about" */ '../views/404.vue')
  },

export const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home,
    children: [
	{
      path: '/', // 必须含有默认 才能动态
      component: {
        render: h => h('div',{},12311)
      }
    }
	]
  },
  {
    path: '/about',
    name: 'About',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
  }
]

import Tex from "./Text";
获取如下
component: (resolve) => require(["./Text.vue"], resolve), //将组件用require引进来
this.$router.options.routes[0].children.push({
        //插入路由
        name: "list",
        path: "/list",
         component：Tex
      });
      this.$router.addRoutes(this.$router.options.routes); //调用addRoutes添加路由
      this.$router.push({
        path: "/list",
      });

版权声明：本文来源CSDN，感谢博主原创文章，遵循 CC 4.0 by-sa 版权协议，转载请附上原文出处链接和本声明。
原文链接：https://blog.csdn.net/qq_43505774/article/details/111296927
站方申明：本站部分内容来自社区用户分享，若涉及侵权，请联系站方删除。

发表于 2021-05-30 16:37:50
阅读 ( 481 )
分类：前端

vue路由动态增加组件渲染

你可能感兴趣的文章

精选的优质文章

0 条评论

官方社群

GO教程

推荐文章

猜你喜欢

随便看看