vue2 设置router-view默认路径的实例


Posted in Javascript onSeptember 20, 2018

在学习vue的时候,遇到很多问题,这里做一些总结,持续更新。

今天说一个问题,就是在学习vue的时候,从之前的1.0版本升级到2.x的时候,遇到的问题。一个简单的设置默认路由。

在vue的官方文档中,并没有对这个做出案例和解释,不知道是不是我没发现。反正这个问题算是遇到的小小的坑吧。原谅一个菜鸟,什么都不懂。

在察阅文章的过程中,发现有前辈总结了这个方面的知识。

具体实现如下:

import Vue from 'vue' 
import Router from 'vue-router' 
import goods from '../components/goods/goods' 
import ratings from '../components/ratings/ratings' 
import seller from '../components/seller/seller' 
 
Vue.use(Router) 
 
export default new Router({ 
 routes: [ 
  {path: '/', redirect: 'goods'}, 
  {path: '/goods', component: goods}, 
  {path: '/ratings', component: ratings}, 
  {path: '/seller', component: seller} 
 ] 
})

其实要说的话,文档也是有这方面的说明的,就是重定向。redirect将进入时的路径,重新定位到goods上,一进来就可以打开goods页面,其实也是这个道理。

以上这篇vue2 设置router-view默认路径的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery 解析xml文件
Aug 09 Javascript
JS实现字体选色板实例代码
Nov 20 Javascript
javascript DIV实现跟随鼠标移动
Mar 19 Javascript
json的使用小结
Jun 08 Javascript
js运动事件函数详解
Oct 21 Javascript
js实现hashtable的赋值、取值、遍历操作实例详解
Dec 25 Javascript
利用策略模式与装饰模式扩展JavaScript表单验证功能
Feb 14 Javascript
浅谈JS中的常用选择器及属性、方法的调用
Jul 28 Javascript
Vue2.0 多 Tab切换组件的封装实例
Jul 28 Javascript
基于jQuery的表单填充实例
Aug 22 jQuery
Vue中使用方法、计算属性或观察者的方法实例详解
Oct 31 Javascript
Vue路由守卫及页面登录权限控制的设置方法(两种)
Mar 31 Javascript
vue实现同一个页面可以有多个router-view的方法
Sep 20 #Javascript
vuejs router history 配置到iis的方法
Sep 20 #Javascript
关于单文件组件.vue的使用
Sep 20 #Javascript
vue-cli 打包使用history模式的后端配置实例
Sep 20 #Javascript
jQuery pjax 应用简单示例
Sep 20 #jQuery
微信小程序scroll-view横向滑动嵌套for循环的示例代码
Sep 20 #Javascript
Vuejs+vue-router打包+Nginx配置的实例
Sep 20 #Javascript
You might like
PHP 文件类型判断代码
2009/03/13 PHP
探讨:如何编写PHP扩展
2013/06/13 PHP
php调用MySQL存储过程的方法集合(推荐)
2013/07/03 PHP
php使用explode()函数将字符串拆分成数组的方法
2015/02/17 PHP
php eval函数一句话木马代码
2015/05/21 PHP
WordPress中获取指定分类及其子分类下的文章数目
2015/12/31 PHP
PHP中$GLOBALS['HTTP_RAW_POST_DATA']和$_POST的区别分析
2017/07/03 PHP
php实现QQ小程序发送模板消息功能
2019/09/18 PHP
动手学习无线电
2021/03/10 无线电
jquery ajax跨域解决方法(json方式)
2014/02/04 Javascript
深入学习JavaScript的AngularJS框架中指令的使用方法
2016/03/05 Javascript
微信小程序之网络请求简单封装实例详解
2017/06/28 Javascript
React Native之ListView实现九宫格效果的示例
2017/08/02 Javascript
解决vue 格式化银行卡(信用卡)每4位一个符号隔断的问题
2018/09/14 Javascript
jquery简单实现纵向的无缝滚动代码实例
2019/04/01 jQuery
Angular8路由守卫原理和使用方法
2019/08/29 Javascript
解决layui中onchange失效以及form动态渲染失效的问题
2019/09/27 Javascript
javascript 高级语法之继承的基本使用方法示例
2019/11/11 Javascript
在weex中愉快的使用scss的方法步骤
2020/01/02 Javascript
Python md5与sha1加密算法用法分析
2017/07/14 Python
利用python numpy+matplotlib绘制股票k线图的方法
2019/06/26 Python
Jupyter notebook运行Spark+Scala教程
2020/04/10 Python
基于django 的orm中非主键自增的实现方式
2020/05/18 Python
python 爬取腾讯视频评论的实现步骤
2021/02/18 Python
CSS3实现简易版的刮刮乐效果
2016/09/27 HTML / CSS
建筑自我鉴定
2013/10/19 职场文书
函授自我鉴定
2013/11/06 职场文书
现金会计岗位职责
2013/12/05 职场文书
中学生爱国演讲稿
2013/12/31 职场文书
执行总经理岗位职责
2014/02/03 职场文书
优秀老员工获奖感言
2014/02/15 职场文书
利群广告词
2014/03/20 职场文书
大学活动总结模板
2014/07/10 职场文书
2015年售票员工作总结
2015/04/29 职场文书
大学生志愿者心得体会
2016/01/15 职场文书
一级电子管军用接收机测评
2022/04/05 无线电