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方法+js一般方法+js面向对象方法实现拖拽效果
Aug 30 Javascript
Node.js插件的正确编写方式
Aug 03 Javascript
js实现简单计算器
Nov 22 Javascript
基于JavaScript实现Json数据根据某个字段进行排序
Nov 24 Javascript
AngularJS入门教程之Scope(作用域)
Jul 27 Javascript
浅析JavaScript的几种Math函数,random(),ceil(),round(),floor()
Dec 22 Javascript
js中字符型和数值型数字的互相转化方法(必看)
Apr 25 Javascript
通过npm或yarn自动生成vue组件的方法示例
Feb 12 Javascript
详解微信小程序开发聊天室—实时聊天,支持图片预览
May 20 Javascript
详解js location.href和window.open的几种用法和区别
Dec 02 Javascript
详解如何在JS代码中消灭for循环
Dec 11 Javascript
微信小程序实现modal弹出框遮罩层组件(可带文本框)
Dec 20 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
实用函数7
2007/11/08 PHP
PHP通过反射动态加载第三方类和获得类源码的实例
2015/11/27 PHP
php判断邮箱地址是否存在的方法
2016/02/13 PHP
PHP单例模式简单用法示例
2017/06/23 PHP
JavaScript操作XML实例代码(获取新闻标题并分页,并分页)
2010/05/25 Javascript
小试JQuery的AutoComplete插件
2011/05/04 Javascript
jquery、js调用iframe父窗口与子窗口元素的方法整理
2014/07/31 Javascript
jQuery中:hidden选择器用法实例
2014/12/30 Javascript
javascript实现密码强度显示
2015/03/18 Javascript
JavaScript截断字符串的方法
2015/07/15 Javascript
JS简单实现城市二级联动选择插件的方法
2015/08/19 Javascript
仿Angular Bootstrap TimePicker创建分钟数-秒数的输入控件
2016/07/01 Javascript
JS实现异步上传压缩图片
2017/04/22 Javascript
js原生代码实现轮播图的实例讲解
2017/07/28 Javascript
js 索引下标之li集合绑定点击事件
2018/01/12 Javascript
vue短信验证性能优化如何写入localstorage中
2018/04/25 Javascript
Javascript作用域和作用域链原理解析
2020/03/03 Javascript
[08:47]DOTA2每周TOP10 精彩击杀集锦vol.6
2014/06/25 DOTA
[00:35]DOTA2上海特级锦标赛 Newbee战队宣传片
2016/03/03 DOTA
查看Python安装路径以及安装包路径小技巧
2015/04/28 Python
django之跨表查询及添加记录的示例代码
2018/10/16 Python
Python QQBot库的QQ聊天机器人
2019/06/19 Python
Python内置数据类型list各方法的性能测试过程解析
2020/01/07 Python
使用Nibabel库对nii格式图像的读写操作
2020/07/01 Python
python如何求圆的面积
2020/07/01 Python
python开发一个解析protobuf文件的简单编译器
2020/11/17 Python
viagogo英国票务平台:演唱会、体育比赛、戏剧门票
2017/03/24 全球购物
Brora官网:英国领先的羊绒服装品牌
2019/08/28 全球购物
迪奥美国官网:Dior美国
2019/12/07 全球购物
日本最大的购物网站:日本乐天市场(Rakuten Ichiba)
2020/11/04 全球购物
什么是用户模式(User Mode)与内核模式(Kernel Mode) ?
2015/09/07 面试题
竞选班干部演讲稿300字
2014/08/20 职场文书
单位推荐信范文
2015/03/27 职场文书
2015年乡镇扶贫工作总结
2015/04/08 职场文书
团组织关系介绍信
2019/06/24 职场文书
java如何实现获取客户端ip地址的示例代码
2022/04/07 Java/Android