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 相关文章推荐
jquery1.4后 jqDrag 拖动 不可用
Feb 06 Javascript
查找iframe里元素的方法可传参
Sep 11 Javascript
JavaScript实现基于十进制的四舍五入实例
Jul 17 Javascript
javascript实现3D切换焦点图
Oct 16 Javascript
JavaScript 拖拽实例代码
Sep 21 Javascript
Javascript 事件冒泡机制详细介绍
Oct 10 Javascript
如何使用headjs来管理和异步加载js
Nov 29 Javascript
Bootstrap CSS使用方法
Dec 23 Javascript
Vue.js -- 过滤器使用总结
Feb 18 Javascript
vue.js实例todoList项目
Jul 07 Javascript
bootstrap Table插件使用demo
Aug 07 Javascript
浅谈vue在html中出现{{}}的原因及解决方式
Nov 16 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 OPCode缓存 APC详细介绍
2010/10/12 PHP
基于php split()函数的用法详解
2013/06/05 PHP
laravel 修改记住我功能的cookie保存时间的方法
2019/10/14 PHP
修改好的jquery滚动字幕效果实现代码
2011/06/22 Javascript
javascript实现倒计时并弹窗提示特效
2015/06/05 Javascript
详解JavaScript UTC时间转换方法
2016/01/07 Javascript
javascript实现任务栏消息提示的简单实例
2016/05/31 Javascript
深入浅析JavaScript中的arguments对象(强力推荐)
2016/06/03 Javascript
jQuery实现的无限级下拉菜单功能示例
2016/09/12 Javascript
NodeJS实现客户端js加密
2017/01/09 NodeJs
详解vue-cli开发环境跨域问题解决方案
2017/06/06 Javascript
jQuery中extend函数简单用法示例
2017/10/11 jQuery
基于Vue2.0+ElementUI实现表格翻页功能
2017/10/23 Javascript
vue axios 在页面切换时中断请求方法 ajax
2018/03/05 Javascript
vue中动态设置meta标签和title标签的方法
2018/07/11 Javascript
Vue中的methods、watch、computed的区别
2018/11/26 Javascript
教你使用vue-cli快速构建的小说阅读器
2019/05/13 Javascript
axios异步提交表单数据的几种方法
2019/08/11 Javascript
使用vuex存储用户信息到localStorage的实例
2019/11/11 Javascript
Vue+Node实现的商城用户管理功能示例
2019/12/23 Javascript
js根据后缀判断文件文件类型的代码
2020/05/09 Javascript
vue 实现tab切换保持数据状态
2020/07/21 Javascript
Element Breadcrumb 面包屑的使用方法
2020/07/26 Javascript
vue-video-player 断点续播的实现
2021/02/01 Vue.js
[44:40]Spirit vs Navi Supermajor小组赛 A组败者组第一轮 BO3 第一场 6.2
2018/06/03 DOTA
对python:print打印时加u的含义详解
2018/12/15 Python
Python Pexpect库的简单使用方法
2019/01/29 Python
python多线程分块读取文件
2019/08/29 Python
Python3 翻转二叉树的实现
2019/09/30 Python
Django后端发送小程序微信模板消息示例(服务通知)
2019/12/17 Python
python实现爱奇艺登陆密码RSA加密的方法示例详解
2020/05/27 Python
你应该知道的30个css选择器
2014/03/19 HTML / CSS
公开服务承诺制度
2014/03/26 职场文书
党的群众路线教育实践活动个人对照检查材料
2014/09/22 职场文书
Web前端:CSS最强总结 附详细代码
2021/03/31 HTML / CSS
详解CSS伪元素的妙用单标签之美
2021/05/25 HTML / CSS