vue路由跳转写法在html,VueRouter&Bootstrap实现导航跳转

VueRouter是Vue提供的一个额外包，是一个可以帮助我们做web统一跳转的路由管理器。

Bootstrap则是提供统一网站风格的框架。

本文主要介绍的是VueRouter，不对Bootstrap做过多的讲解。

项目准备

项目效果演示

本项目主要实现一个导航跳转，点击导航跳转到不同的界面。效果如下：

下载源码

本文采取npm工具实现下载，主要需要下载的源码分为被vue,vue-router,bootstrap,命令如下：

1.vue

源码下载命令：npm install vue –save

需要拷贝到项目中的文件是：vue.js/vue.min.js

2.vue-router

源码下载命令：npm install vue-router –save

需要拷贝到项目中的文件是：vue-router.js/vue-router.min.js

3.bootstrap

源码下载命令：npm install bootstrap@3 –save

需要拷贝到项目中的文件是：dist目录下的三个文件

导入源代码

我的项目是这样的：