Vue -路由（Vue -Router）

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

vue

1.github地址：https://github.com/vuejs/router" title="vue-router">vue-router

2.官方文档地址：https://router.vuejs.org/zh/

3.Vue-Router安装：npm i vue-router --save

　　安装完成后，会在项目的package.json文件中显示vue-router插件，如下：

  "dependencies": {
    "animate.css": "^3.7.2",
    "element-ui": "^2.13.1",
    "moment": "^2.24.0",
    "pubsub-js": "^1.8.0",
    "shortid": "^2.2.15",
    "vant": "^2.6.3",
    "vue": "^2.5.2",
    "vue-router": "^3.1.6"
  },

 4. 配置路由：

　　4.1. 在src文件夹中新建一个router.js文件，内容：

import Vue from 'vue'    //引入vue
import Router from 'vue-router'  //引入路由
Vue.use(Router);  //表示在Vue中使用Router
//要应用于整个项目，需要向外配置一个实例
export default new Router({
  routes:[     //此处可以添加路由位置
  ],
});     // 配置一个实例

　　4.2.在main.js中引用，内容如下：

//导入router
import router from './router.js'

new Vue({
  el: '#app',
  // router:router,  //在Vue实例中引用router
  router,  //也可以
  components: { App },
  template: '<App/>'
});

以上是 Vue -路由（Vue -Router） 的全部内容，
                        来源链接：
                            utcz.com/z/379259.html
回到顶部