问空白页面，vue.js中没有错误
EN

Stack Overflow用户

提问于 2020-02-23 13:42:40

回答 1查看 398关注 0票数 1

我是个初学者。我在试着学习vue js。当我尝试运行任何像/anything这样的页面时，它会重定向到index.html页面。我找不到错误所在。请帮帮我。任何帮助都将不胜感激。

<template>
  <v-form>
    <v-container>
      <v-row>

        <v-col cols="12" sm="6">
          <v-text-field
            label="Username"
            required
          ></v-text-field>
        </v-col>

     <v-col cols="12" sm="6">
        <v-text-field
                  label="Password"
            type="password"
          ></v-text-field>
        </v-col>

      </v-row>
    </v-container>
  </v-form>
</template>

main.js

import Vue from 'vue'
import App from './App.vue'
import VueRouter from 'vue-router'

Vue.config.productionTip = false
const routes = [];

const router = new VueRouter({ mode: 'history', routes: routes });

new Vue({
  render: h => h(App),
  router
}).$mount('#app')

index.js

import Vue from "vue"
import Router from "vue-router"
import Register from "@/components/Register"
import HelloWorld from "@/components/HelloWorld";
Vue.use(Router)

export default new Router({
  routes: [

    {
      path: "/register",
      name: "Register",
      component: Register
    },

  ]
})

vue.js

回答 1

Stack Overflow用户

发布于 2020-02-23 21:39:52

您的路由在main.js中为空：

const routes = []; //<= here

const router = new VueRouter({ mode: 'history', routes: routes });

假设你的路由器index.js在一个“src/ VueRouter”文件夹中，你不需要在你的main.js中实例化一个新的路由器，只需要一个自定义的，如下所示：

import Vue from 'vue'
import App from './App.vue'
import router from './router' //<= import your index.js as "router"

Vue.config.productionTip = false

new Vue({
  render: h => h(App),
  router
}).$mount('#app')

编辑：

如果您想保持history模式，则需要在客户路由器中进行定义：

import Vue from "vue"
import Router from "vue-router"
import Register from "@/components/Register"
import HelloWorld from "@/components/HelloWorld";
Vue.use(Router)

export default new Router({
  mode: 'history, // <= here
  routes: [
    {
      path: "/register",
      name: "Register",
      component: Register
    },

  ]
})

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/60359535

复制

相似问题

问空白页面，vue.js中没有错误
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问空白页面，vue.js中没有错误EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问空白页面，vue.js中没有错误
EN