vue 2.8.2版本配置刚进入时候的默认页面方法


Posted in Javascript onSeptember 21, 2018

vue --version查看版本 是 2.8.2;

vue 2.8.2版本配置刚进入时候的默认页面比如这里面的goods页面;

1.在路由文件下里面的index.js文件 添加 { path: '/', redirect: '/goods/goods' }, // 默认就跳转此页面

2.也可以在app.vue里面配置

this.$router.push('/goods/goods'); // 页面加载时跳转

详情看下面

export default {
 name: 'app',
 components: {
  'v-header': header
 },
 created () {
//  this.$router.push('/goods/goods'); // 页面加载时跳转
 }
 };

前提都配置了此组件路由index.js文件如下

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/goods' }, // 默认就跳转此页面
 {
  path: '/goods/goods',
  name: 'goods',
  component: goods
 },
 {
  path: '/ratings/ratings',
  name: 'ratings',
  component: ratings
 },
 {
  path: '/seller/seller',
  name: 'seller',
  component: seller
 }
 ]
});

以上这篇vue 2.8.2版本配置刚进入时候的默认页面方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
分页栏的web标准实现
Nov 01 Javascript
JS操作Cookies的小例子
Oct 15 Javascript
基于Bootstrap和jQuery构建前端分页工具实例代码
Nov 23 Javascript
JS正则表达式修饰符global(/g)用法分析
Dec 27 Javascript
分享bootstrap学习笔记心得(组件及其属性)
Jan 11 Javascript
js简单实现网页换肤功能
Apr 07 Javascript
js学习心得_一个简单的动画库封装tween.js
Jul 14 Javascript
vue响应式更新机制及不使用框架实现简单的数据双向绑定问题
Jun 27 Javascript
vue用BMap百度地图实现即时搜索功能
Sep 26 Javascript
使用layui前端框架弹出form表单以及提交的示例
Oct 25 Javascript
vue css 引入asstes中的图片无法显示的四种解决方法
Mar 16 Javascript
vue实现简单全选和反选功能
Sep 15 Javascript
Puppeteer环境搭建的详细步骤
Sep 21 #Javascript
jQuery序列化form表单数据为JSON对象的实现方法
Sep 20 #jQuery
JavaScript 高性能数组去重的方法
Sep 20 #Javascript
vue2 设置router-view默认路径的实例
Sep 20 #Javascript
vue实现同一个页面可以有多个router-view的方法
Sep 20 #Javascript
vuejs router history 配置到iis的方法
Sep 20 #Javascript
关于单文件组件.vue的使用
Sep 20 #Javascript
You might like
第九节--绑定
2006/11/16 PHP
ADODB的数据库封包程序库
2006/12/31 PHP
php文件怎么打开 如何执行php文件
2011/12/21 PHP
分享一个PHP数据流应用的简单例子
2012/06/01 PHP
一个简单的网页密码登陆php代码
2012/07/17 PHP
php设计模式之备忘模式分析【星际争霸游戏案例】
2020/03/24 PHP
jQuery 处理网页内容的实现代码
2010/02/15 Javascript
javascript dom追加内容实现示例
2013/09/21 Javascript
JS上传图片前实现图片预览效果的方法
2015/03/02 Javascript
js使用DOM操作实现简单留言板的方法
2015/04/10 Javascript
基于RequireJS和JQuery的模块化编程日常问题解析
2016/04/14 Javascript
js阻止默认浏览器行为与冒泡行为的实现代码
2016/05/15 Javascript
Js获取图片原始宽高的实现代码
2016/05/17 Javascript
Three.js学习之网格
2016/08/10 Javascript
js实现做通讯录的索引滑动显示效果和滑动显示锚点效果
2017/02/18 Javascript
详解vue + vuex + directives实现权限按钮的思路
2017/10/24 Javascript
webpack 处理CSS资源的实现
2019/09/27 Javascript
基python实现多线程网页爬虫
2015/09/06 Python
python 实现提取某个索引中某个时间段的数据方法
2019/02/01 Python
python基于Selenium的web自动化框架
2019/07/14 Python
python查看数据类型的方法
2019/10/12 Python
在python中实现求输出1-3+5-7+9-......101的和
2020/04/02 Python
python如何输出反斜杠
2020/06/18 Python
Python unittest如何生成HTMLTestRunner模块
2020/09/08 Python
python绘制分布折线图的示例
2020/09/24 Python
英国卫浴商店:Ergonomic Design
2019/09/22 全球购物
蒂娜商店:Tiina the Store
2019/12/07 全球购物
牵手50新加坡:专为黄金岁月的单身人士而设的交友网站
2020/08/16 全球购物
vue 中 get / delete 传递数组参数方法
2021/03/23 Vue.js
酒店总经理欢迎词
2014/01/08 职场文书
幼儿园教师个人反思
2014/01/30 职场文书
小学家长评语大全
2014/04/16 职场文书
企业宣传标语
2014/06/09 职场文书
西岭雪山导游词
2015/02/06 职场文书
建党伟业电影观后感
2015/06/01 职场文书
Android Flutter实现图片滑动切换效果
2022/04/07 Java/Android