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

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版本配置刚进入时候的默认页面方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 详解vue-cli + webpack 多页面实例配置优化方法

    本文介绍了vue-cli + webpack 多页面实例配置优化方法,分享给大家 vue+webpack是否有多页面 目前使用vue来做项目,估计大部分都是单页面(SPA)应用,一个轻型的 MVVM 框架,谁用了MVVM框架,就再也回不去JQ时代了,哈哈. 在手机端的项目,使用vue + vue-router是high到爆,不仅仅是我们开发的而言,最主要的用户体检也是开足马力,体检感杠杠的. 那问题来了,使用vue+webpack的单页面是爽到爆,那如果是多页面也能不能high到爆呢?那当然呀,

  • vue-cli创建的项目,配置多页面的实现方法

    vue官方提供的命令行工具vue-cli,能够快速搭建单页应用.默认一个页面入口index.html,那么,如果我们需要多页面该如何配置,实际上也不复杂 假设要新建的页面是rule,以下以rule为例 创建新的html页面 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=d

  • vue配置多页面的实现方法

    vue配置多页面的实现方法

    1.安装环境 ①安装node.js 并添加入环境变量PATH ②安装淘宝NPM镜像 $ npm install -g cnpm --registry=https://registry.npm.taobao.org ③安装webpack npm install webpack -g ④安装vue-cli脚手架 npm install -g vue-cli ⑤创建项目模板 vue init wepack vue-multipage-demo ⑥cmd进入到要放项目的文件夹 ⑦安装 cnpm inst

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

    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', compone

  • vue.js路由mode配置之去掉url上默认的#方法

    比如 : http://localhost:8080/#/login 路由中间默认带有 # 如果需要去掉#,只需将mode的默认值'hash'改为'history'即可. router.js : import Router from 'vue-router' import routers from './routers' export default () => { return new Router({ routers, mode: 'history' // 加上这个配置项,url默认的 #

  • 详解Vue前端生产环境发布配置实战篇

    前言 首先这篇文章是写给Vue新手的,老司机基本不用看了. 当我们刚接触vue的时候,特别是对于第一次用前端框架的同学来说,心情可以说是比较激动的,框架带来的种种新体验,是以前jQuery无法给你的兴奋和满足感.但是在体验了几个demo的新鲜感之后,我们就要考虑如何把框架结合到我们实际的开发中如何应用的问题了. 下面我主要总结三个和生产发布相关的问题:资源文件发布文件夹配置,图片文件的引用,以及后台接口调试方法. 一,资源文件发布配置 一般项目都是用vue-cli脚手架搭建项目,然后编写自己的代

  • vue 解决IOS10低版本白屏的问题

    vue 解决IOS10低版本白屏的问题

    新公司是做自己的独立产品,比之前呆过的外包公司要求严格的多,注重用户体验,以下是在新项目里进行前端优化的一些操作 一,低版本空白屏问题,以及ios8的样式问题 本项目是通过vue-cli搭建,上线以后运行在新版本的苹果手机和安卓手机上均无问题.但是在ios8 9上出现了空白屏的原理,经过测试以后发现是低版本不兼容es6的语法,经过几番尝试找到了最优解. 1 空白屏问题 首先安装babel-polyfill,安装命令:npm install --save-dev babel-polyfill 安装

  • vue.config.js打包优化配置

    vue.config.js打包优化配置

    百度上的资料五花八门让人眼花缭乱,别急,这时候我替你亲身经历了,有需要的可以参考下,先上效果图,以免你们以为我吹牛逼,嘻嘻 优化方向 1.图片资源压缩 2.将 productionSourceMap 设为 false,map不进行生成 3.cdn配置(可选) 4.代码压缩 5.公共代码抽离(个人感觉没啥用) 未优化之前的 //感觉太大了 抬它 优化之后的 废话不多说了,上代码是重点 这些是必要的下载 /*cnpm install image-webpack-loader --save-dev c

  • 在Vue中使用Avue、配置过程及实际应用小结

    目录 1.使用Avue的原因 2.Avue的官网 3.安装使用 3.1 安装 3.2 在main.js中引入 4 使用Avue组件库 4.1 基本样式 4.2 实际应用 4.3 效果 在新项目中用到一个新的小玩意.还挺不错的.立马安装使用到自己的项目中.哈哈哈 1.使用Avue的原因 在项目中遇到通过点击加号实现输入框的增加.以及对该输入框的输入内容进行验证.有感而发 2.Avue的官网 官网地址:https://avuejs.com/ 3.安装使用 可以直接根据官网的教程来 以下介绍我成功安装

  • Vue中使用vux的配置详解

    Vue中使用vux的配置,分为两种情况: 一.根据vux文档直接安装,无需手动配置 npm install vue-cli -g // 如果还没安装 vue init airyland/vux2 my-project // 创建名为 my-project 的模板 cd my-project // 进入项目 npm install --registry=https://registry.npm.taobao.org // 开始安装 npm run dev // 运行项目 二.想在已创建的Vue工程

  • windows server 2008 64位MySQL5.6免安装版本配置方法图解

    windows server 2008 64位MySQL5.6免安装版本配置方法图解

    1 通过官网下载MySQL5.6版本压缩包,mysql-5.6.36-winx64.zip: 2 在D盘创建目录,比如D:\MySQL,将mysql-5.6.36-winx64.zip解压缩到该目录下,如下图所示: 3 修改系统Path变量,增加D:\MySQL\bin,如下图所示: 4 以管理员身份运行cmd,切换到D:\MySQL\bin目录, 安装服务mysqld –install 启动服务net start mysql 服务启动成功之后,通过mysql命令行登录 Mysql –u roo

  • Parcel.js + Vue 2.x 极速零配置打包体验教程

    继 Browserify.Webpack 之后,又一款打包工具 Parcel 横空出世 Parcel.js 的官网有这样的自我介绍 "极速零配置Web应用打包工具" 简单接触了一下,单从效率上来说,确实要比 webpack 强上不少,可坑也挺多,未来升级之后应该会逐渐普及 官方文档:https://parceljs.org/getting_started.html 官方 GitHub:https://github.com/parcel-bundler/parcel 一.基本用法 Par

  • VUE脚手架的下载和配置步骤详解

    VUE脚手架下载 1.第一步全局安装脚手架 cnpm i @vue/cli -g 2.第二步创建项目 创建文件夹,打开文件命令窗口 vue create 自己创建的项目名 3. 有两个选项,选择第二个,也就是自己选择配置 4. 选择自己需要的配置 5. 进行下一步,选择 Y 6. 选择自己的类型 7.选择.json类型 8.此处, 选择 N 下载完成 文件夹完成下载 最后把 文件跑起来 以上所述是小编给大家介绍的VUE脚手架的下载和配置详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,

随机推荐