vue学习（四）登陆、注册、首页模板页区分

  • Z时代
  • 2024-01-10
  • 分类：综合

vue

按照上面文章配置完毕后，会发现有个问题，我登陆页面、注册页面是不需要视图页的。

开始配置路由

重新配置main.js

引入

import App from \'./App\'  //引入vue组件

更改启动项

new Vue({
  el: \'#app\',
  router: Router,
  components: { App },
  template: \'<App/>\'
})

改为APP启动

配置router/index.js

先引入视图页和404页

//布局模板页
import Layouts from "../components/layout/Layout";
import NotFoundView from \'../components/404\'

更改路由

export default new Router({
  routes: [
    {
      path: \'/login\',
      component: Login
    },
    // ...person,
    // // 404,500 错误页面
    // ...error,
    {
      path: \'/\',
      component: Layouts,
      children: [
        {
          path: \'/index\',
          alias: \'\',
          component: Index,
          name: \'Index\',
          meta: { description: \'Overview of environment\' }
        }
      ]
    }, {
      // not found handler
      path: \'*\',
      component: NotFoundView
    }
  ],
  mode: "history"//干掉地址栏里边的#号键
})

思路就是把需要视图页的页面，把它们放在视图页下的子路由

404.vue 页面自定义

// ...user,
// 404,500 错误页面
// ...error,

上面代码的意思，为了简洁我把一个功能的路由都配置在了一个文件  比如 user.js 等

以上是 vue学习（四）登陆、注册、首页模板页区分 的全部内容， 来源链接： utcz.com/z/380064.html

回到顶部