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 布尔型分析
Dec 22 Javascript
为你的网站增加亮点的9款jQuery插件推荐
May 03 Javascript
Jquery实现图片左右自动滚动示例
Sep 25 Javascript
javascript实现十六进制颜色值(HEX)和RGB格式相互转换
Jun 20 Javascript
jQuery插件scroll实现无缝滚动效果
Apr 27 Javascript
举例讲解jQuery对DOM元素的向上遍历、向下遍历和水平遍历
Jul 07 Javascript
js检查是否关闭浏览器的方法
Aug 02 Javascript
jQuery源码分析之sizzle选择器详解
Feb 13 Javascript
微信小程序 action-sheet 反馈上拉菜单简单实例
May 11 Javascript
实例详解JavaScript中setTimeout函数的执行顺序
Jul 12 Javascript
解决layui数据表格排序图标被超出的表头挤出去的问题
Sep 19 Javascript
Vue快速实现通用表单验证功能
Dec 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可能遇到的问题“无法载入mysql扩展” 的解决方法
2007/04/16 PHP
学习php设计模式 php实现模板方法模式
2015/12/08 PHP
让mayfish支持mysqli数据库驱动的实现方法
2010/05/22 Javascript
JavaScript的模块化:封装(闭包),继承(原型) 介绍
2013/07/22 Javascript
Javascript写入txt和读取txt文件示例
2014/02/12 Javascript
Javascript 拖拽雏形(逐行分析代码,让你轻松了拖拽的原理)
2015/01/23 Javascript
返回函数的JavaScript函数
2016/06/14 Javascript
JS实现密码框的显示密码和隐藏密码功能示例
2016/12/26 Javascript
js实现点击按钮复制文本功能
2020/07/20 Javascript
引入外部js脚本加载慢与页面白屏问题的解决
2018/12/10 Javascript
jQuery实现当拉动滚动条到底部加载数据的方法分析
2019/01/24 jQuery
antd vue table跨行合并单元格,并且自定义内容实例
2020/10/28 Javascript
python根据路径导入模块的方法
2014/09/30 Python
python抓取网页中链接的静态图片
2018/01/29 Python
Python 实现微信防撤回功能
2019/04/29 Python
django的ORM操作 增加和查询
2019/07/26 Python
Django 反向生成url实例详解
2019/07/30 Python
python读取指定字节长度的文本方法
2019/08/27 Python
python scatter函数用法实例详解
2020/02/11 Python
基于python实现计算且附带进度条代码实例
2020/03/31 Python
使用pyecharts1.7进行简单的可视化大全
2020/05/17 Python
Python pysnmp使用方法及代码实例
2020/08/24 Python
简述synchronized和java.util.concurrent.locks.Lock的异同
2014/12/08 面试题
工作人员思想汇报
2014/01/09 职场文书
如何写好优秀的创业计划书
2014/01/30 职场文书
校园摄影活动策划方案
2014/02/05 职场文书
酒店管理毕业生自我鉴定
2014/03/02 职场文书
毕业生自荐信格式
2014/03/07 职场文书
爬山的活动方案
2014/08/16 职场文书
2014乡镇机关党员个人对照检查材料思想汇报
2014/10/09 职场文书
假释思想汇报范文
2014/10/11 职场文书
公司2014年度工作总结
2014/12/10 职场文书
承德避暑山庄导游词
2015/02/03 职场文书
2015最新民情日记范文
2015/06/26 职场文书
Vue3.0中Ref与Reactive的区别示例详析
2021/07/07 Vue.js
vue中div禁止点击事件的实现
2022/04/02 Vue.js