Vue Router - 路由的使用、两种切换方式、两种传参方式、嵌套方式

  免费查看本文章可前往我的网站：PiQiu

目录

一、Vue Router

1.1、下载

1.2、基本使用

a）引入 vue-router.js（注意：要在 Vue.js 之后引入）.

 b）创建好路由规则

c）注册到 Vue 实例中

d）展示路由组件

1.3、切换路由的两种方式

1.3.1、以标签的方式切换

1.3.2、以 js 方式切换

1.3.3、vue3 中以 js 方式切换

1.3.4、在 VueRouter 中多次切换同一个路由存在问题

a）解决方法一：每次切换路由前手动判断

1.4、两种传参方式

1.4.1、通过 querystring 传参

1.4.2、通过 restful 传参

1.5、嵌套路由的使用

---

一、Vue Router

---

1.1、下载

通过 Vue Router 可以将现有的 Vue 开发更灵活，使得一个页面中展示多个不同的组件.

下载地址如下：

https://unpkg.com/vue-router/dist/vue-router.js

1.2、基本使用

a）引入 vue-router.js（注意：要在 Vue.js 之后引入）.

    <script src="../js/vue.js"></script>
    <!-- router 必须在 vue.js 之后引入 -->
    <script src="../js/vue-router.js"></script>