美文网首页Vue学习笔记
Vue路由跳转配置

Vue路由跳转配置

作者: 东了个尼 | 来源:发表于2019-11-26 10:17 被阅读0次
vue路由配置:
    1.安装 
    npm install vue-router  --save   / cnpm install vue-router  --save
    2、引入并 Vue.use(VueRouter)   (main.js文件中)
      2.1导入VueRouter组件
        import VueRouter from 'vue-router'
        2.2引用VueRouter
        Vue.use(VueRouter)
    3、配置路由
        1、创建组件 引入组件
        2、定义路由  (建议复制)
            const routes = [
              { path: '/foo', component: Foo },
              { path: '/bar', component: Bar },
              { path: '*', redirect: '/home' }   /*默认跳转路由*/
            ]
        3、实例化VueRouter
            const router = new VueRouter({
              routes // (缩写)相当于 routes: routes
            })

        4、挂载(将 router 引入到vue实例中)
        new Vue({
          el: '#app',
          router,
          render: h => h(App)
        })

相关文章

  • Vue路由

    一、Vue路由基础用法: 二、Vue路由配置的抽出 三、路由动态传值: 四、路由的跳转方式: 五、路由的hash模...

  • 简单遍历vue2.0文档(五)

    11. vue-router 11.1 引用 11.2 配置路由文件 11.3 路由的跳转 11.4 路由的传参 ...

  • Vue-Router

    1. 路由配置 默认路由跳转 在 new Router时可用的配置参数: 2.路由传参 Vue路由传参的几种方式 ...

  • veu传参几种方式

    1、query的方式 2、params的方式 配置路由: 动态路由子路由 vue路由跳转有四种方式 router-...

  • Vue学习笔记[13]-使用vue-router

    在使用vue cli创建项目时可以添加vue-router,或使用npm安装vue-router 配置路由跳转: ...

  • Vue 动态设置路由Meta title 名称

    路由配置 路由跳转 或路由配置 路由跳转 都可以,看着用。随堂笔记防遗忘!

  • Vue路由跳转配置

  • 路由

    路由用来管理不同页面间关系和跳转,我们可以自己配置,这种功能就是路由。路由的本质是hash值,vue 中的路由设置...

  • Flutter路由跳转

    路由配置 定义路由配置信息 在MaterialApp的routes属性中指向设置的路由配置 跳转 1-跳转至配置的...

  • angualr(二) 路由之angualr-router

    创建项目 路由的基本使用 路由对象图示 路由基本配置 路由通配符配置 HTML里面跳转链接 在js里面跳转路由 路...

网友评论

    本文标题:Vue路由跳转配置

    本文链接:https://www.haomeiwen.com/subject/tqcewctx.html