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 相关文章推荐
mailto的使用技巧分享
Dec 21 Javascript
左右悬浮可分组的网站QQ在线客服代码(可谓经典)
Dec 21 Javascript
js弹出层包含flash 不能关闭隐藏的2种处理方法
Jun 17 Javascript
javascript中负数算术右移、逻辑右移的奥秘探索
Oct 17 Javascript
jqplot通过ajax动态画折线图的方法及思路
Dec 08 Javascript
JQuery中解决重复动画的方法
Oct 17 Javascript
基于jQuery实现左侧菜单栏可折叠功能
Dec 27 Javascript
jQuery手风琴的简单制作
May 12 jQuery
详解React-Router中Url参数改变页面不刷新的解决办法
May 08 Javascript
如何在Vue.js中实现标签页组件详解
Jan 02 Javascript
Node.js API详解之 V8模块用法实例分析
Jun 05 Javascript
浅谈js中的attributes和Attribute的用法与区别
Jul 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实现json编码的方法
2015/07/30 PHP
3种php生成唯一id的方法
2015/11/23 PHP
php验证身份证号码正确性的函数
2016/07/20 PHP
php爬取天猫和淘宝商品数据
2018/02/23 PHP
PHP实现动态删除XML数据的方法示例
2018/03/30 PHP
PHP验证类的封装与使用方法详解
2019/01/10 PHP
用正则获取指定路径文件的名称
2007/02/27 Javascript
js处理json以及字符串的比较等常用操作
2013/09/08 Javascript
JQuery中使用Ajax赋值给全局变量异常的解决方法
2014/01/10 Javascript
使用 js+正则表达式为关键词添加链接
2014/11/11 Javascript
jquery事件的ready()方法使用详解
2015/11/11 Javascript
Bootstrap每天必学之表单
2015/11/23 Javascript
jQuery实现二级下拉菜单效果
2016/01/05 Javascript
AngularJS 遇到的小坑与技巧小结
2016/06/07 Javascript
详解axios在node.js中的post使用
2017/04/27 Javascript
对angularJs中$sce服务安全显示html文本的实例
2018/09/30 Javascript
详解vue组件之间的通信
2020/08/30 Javascript
vue打包静态资源后显示空白及static文件路径报错的解决
2020/09/02 Javascript
解决vue打包 npm run build-test突然不动了的问题
2020/11/13 Javascript
使用XML库的方式,实现RPC通信的方法(推荐)
2017/06/14 Python
Django Channel实时推送与聊天的示例代码
2020/04/30 Python
keras 使用Lambda 快速新建层 添加多个参数操作
2020/06/10 Python
python 实现控制鼠标键盘
2020/11/27 Python
python RSA加密的示例
2020/12/09 Python
澳大利亚儿童和婴儿产品在线商店:Lime Tree Kids
2017/10/05 全球购物
伯利陶器:Burleigh Pottery
2018/01/03 全球购物
澳大利亚最大的网上油画销售画廊:Direct Art Australia
2018/04/15 全球购物
前台接待的工作职责
2013/11/21 职场文书
松材线虫病防治方案
2014/06/15 职场文书
普通党员对照检查材料
2014/08/28 职场文书
房地产经营管理专业自荐信
2014/09/02 职场文书
学生抄作业检讨书(2篇)
2014/10/17 职场文书
工程部文员岗位职责
2015/02/04 职场文书
小学运动会通讯稿
2015/07/18 职场文书
《只有一个地球》教学反思
2016/02/16 职场文书
vue+spring boot实现校验码功能
2021/05/27 Vue.js