vue设置一开始进入的页面教程


Posted in Javascript onOctober 28, 2019

vue项目默认进入的页面是

HelloWorld.vue

现在我们创建一个页面Login.vue

<template>
  <div>
登录界面
  </div>
</template>
<script type="text/ecmascript-6">
  export default {
    data() {
      return {}
    }
  }
</script>

在router目录下的index.js文件中我们设置一开始进入的页面

初始index.js文件:

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
Vue.use(Router)
 
export default new Router({
 routes: [
  {
   path: '/',
   name: 'HelloWorld',
   component: HelloWorld
  }
 ]
})

现在我们让他一开始进入登录页面Login.vue;

import Vue from 'vue'
import Router from 'vue-router'
import Login from '@/components/Login'
Vue.use(Router)
export default new Router({
 routes: [
  {
   path: '/',
   name: 'Login',
   component: Login
  }
 ]
})

运行后:

vue设置一开始进入的页面教程

以上这篇vue设置一开始进入的页面教程就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JQUERY的属性选择符和自定义选择符使用方法(二)
Apr 07 Javascript
js实现addClass,removeClass,hasClass的函数代码
Jul 13 Javascript
JavaScript快速检测浏览器对CSS3特性的支持情况
Sep 26 Javascript
js实现上传图片之上传前预览图片
Mar 25 Javascript
jquery配合css简单实现返回顶部效果
Sep 30 Javascript
用Node.js通过sitemap.xml批量抓取美女图片
May 28 Javascript
纯js和css完成贪吃蛇小游戏demo
Sep 01 Javascript
关于Jquery中的事件绑定总结
Oct 26 Javascript
vuejs父子组件通信的问题
Jan 11 Javascript
微信小程序 点击控件后选中其它反选实例详解
Feb 21 Javascript
用JS编写一个函数,返回数组中重复出现过的元素(实例)
Sep 14 Javascript
Vue实现侧边菜单栏手风琴效果实例代码
May 31 Javascript
Vue调用后端java接口的实例代码
Oct 28 #Javascript
原生js实现商品筛选功能
Oct 28 #Javascript
使用Vue实现调用接口加载页面初始数据
Oct 28 #Javascript
JavaScript制作3D旋转相册
Aug 02 #Javascript
微信小程序工具函数封装
Oct 28 #Javascript
js实现3D照片墙效果
Oct 28 #Javascript
vue+webpack 更换主题N种方案优劣分析
Oct 28 #Javascript
You might like
php遍历目录viewDir函数
2009/12/15 PHP
PHP IE中下载附件问题解决方法
2014/01/07 PHP
windows7下安装php的imagick和imagemagick扩展教程
2014/07/04 PHP
php中文验证码实现方法
2015/06/18 PHP
jQuery+CSS 半开折叠效果原理及代码(自写)
2013/03/04 Javascript
node.js中的fs.stat方法使用说明
2014/12/16 Javascript
JavaScript实现的链表数据结构实例
2015/04/02 Javascript
javascript实现的淘宝旅行通用日历组件用法实例
2015/08/03 Javascript
Bootstrap 3 按钮标签实例代码
2017/02/21 Javascript
BootStrap 表单控件之单选按钮水平排列
2017/05/23 Javascript
深入理解vue-loader如何使用
2017/06/06 Javascript
ES6正则表达式扩展笔记
2017/07/25 Javascript
微信小程序实现YDUI的ScrollTab组件
2018/02/02 Javascript
浅谈针对Vue相同路由不同参数的刷新问题
2018/09/29 Javascript
javascript实现图片轮播代码
2019/07/09 Javascript
JS回调函数原理与用法详解【附PHP回调函数】
2019/07/20 Javascript
webpack 处理CSS资源的实现
2019/09/27 Javascript
python基础教程之Hello World!
2014/08/29 Python
python通过Windows下远程控制Linux系统
2018/06/20 Python
python实现单链表中删除倒数第K个节点的方法
2018/09/28 Python
python交换两个变量的值方法
2019/01/12 Python
Python socket模块实现的udp通信功能示例
2019/04/10 Python
python-视频分帧&amp;多帧合成视频实例
2019/12/10 Python
利用Pytorch实现简单的线性回归算法
2020/01/15 Python
python神经网络编程实现手写数字识别
2020/05/27 Python
python 批量将中文名转换为拼音
2021/02/07 Python
精选干货:Java精选笔试题附答案
2014/01/18 面试题
求职简历自荐信范文
2013/10/21 职场文书
大学生毕业自我评价范文分享
2013/11/07 职场文书
企业门卫岗位职责
2013/12/12 职场文书
通信生自我鉴定
2014/01/18 职场文书
初中升旗仪式演讲稿
2014/05/08 职场文书
2015年班主任个人工作总结
2015/03/31 职场文书
学校清洁工岗位职责
2015/04/15 职场文书
大学毕业论文致谢词
2015/05/14 职场文书
mysql的数据压缩性能对比详情
2021/11/07 MySQL