如何设置Vue项目初始进入的页面教程？

本文共计260个文字，预计阅读时间需要2分钟。

Vue项目默认进入的页面是+HelloWorld.vue+，目前我们创建了一个页面+Login.vue+。在+template+标签内，有一个+div+登录界面+div+。在+script+标签中，类型为+text/ecmascript-6+，导出默认值为+{+data() {+return {+}}+}+。在+router+目录下的+index.js+文件中，+“+。

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设置一开始进入的页面教程就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持易盾网络。