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 相关文章推荐
JavaScript静态的动态
Sep 18 Javascript
图片上传判断及预览脚本的效果实例
Aug 07 Javascript
可选择和输入的下拉列表框示例
Nov 05 Javascript
分享一个常用的javascript静态类
Dec 31 Javascript
Javascript 拖拽雏形(逐行分析代码,让你轻松了拖拽的原理)
Jan 23 Javascript
flash+jQuery实现可关闭及重复播放的压顶广告
Apr 15 Javascript
jQuery中on绑定事件后引发的事件冒泡问题如何解决
May 25 Javascript
微信小程序 两种为对象属性赋值的方式详解
Feb 23 Javascript
jQuery实现通过方向键控制div块上下左右移动的方法【测试可用】
Apr 26 jQuery
使用ng-packagr打包Angular的方法示例
Sep 21 Javascript
js作用域及作用域链工作引擎
Jul 07 Javascript
canvas 中如何实现物体的框选
Aug 05 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后台程序与Javascript的两种交互方式
2009/10/25 PHP
php安全之直接用$获取值而不$_GET 字符转义
2012/06/03 PHP
PHP/ThinkPHP实现批量打包下载文件的方法示例
2017/07/31 PHP
很多人都是用下面的js刷新站IP和PV
2008/09/05 Javascript
IE7中javascript操作CheckBox的checked=true不打勾的解决方法
2009/12/07 Javascript
jquery next nextAll nextUntil siblings的区别介绍
2013/10/05 Javascript
js获取select选中的option的text示例代码
2013/12/19 Javascript
javacript使用break内层跳出外层循环分析
2015/01/12 Javascript
JS动画效果打开、关闭层的实现方法
2015/05/09 Javascript
深入理解Ajax的get和post请求
2016/06/02 Javascript
bootstrap动态添加面包屑(breadcrumb)及其响应事件的方法
2017/05/25 Javascript
jquery+ajaxform+springboot控件实现数据更新功能
2018/01/22 jQuery
Vue的elementUI实现自定义主题方法
2018/02/23 Javascript
AngularJS使用Filter自定义过滤器控制ng-repeat去除重复功能示例
2018/04/21 Javascript
使用layer.msg 时间设置不起作用的解决方法
2019/09/12 Javascript
antd的select下拉框因为数据量太大造成卡顿的解决方式
2020/10/31 Javascript
Vue项目利用axios请求接口下载excel
2020/11/17 Vue.js
Javascript 模拟mvc实现点餐程序案例详解
2020/12/24 Javascript
[56:56]VG vs LGD 2019国际邀请赛淘汰赛 胜者组 BO3 第一场 8.22
2019/09/05 DOTA
Python 操作MySQL详解及实例
2017/04/30 Python
python求最大连续子数组的和
2018/07/07 Python
Python常见MongoDB数据库操作实例总结
2018/07/24 Python
python如何发布自已pip项目的方法步骤
2018/10/09 Python
Python利用matplotlib做图中图及次坐标轴的实例
2019/07/08 Python
Python自动化测试笔试面试题精选
2020/03/12 Python
python中前缀运算符 *和 **的用法示例详解
2020/05/28 Python
Django实现前台上传并显示图片功能
2020/05/29 Python
使用Pycharm在运行过程中,查看每个变量的操作(show variables)
2020/06/08 Python
Python+OpenCV图像处理——实现直线检测
2020/10/23 Python
CSS3 边框效果
2019/11/04 HTML / CSS
捷克领先的户外服装及配件市场零售商:ALPINE PRO
2018/01/09 全球购物
《记承天寺夜游》教学反思
2014/02/16 职场文书
地理科学专业自荐信
2014/09/01 职场文书
副总经理党的群众路线教育实践活动个人对照检查材料思想汇报
2014/10/06 职场文书
体育教师教学随笔
2015/08/15 职场文书
python神经网络 使用Keras构建RNN训练
2022/05/04 Python