Не могу заставить роутер работать - PullRequest
Новая
       11

Не могу заставить роутер работать

0 голосов
/ 26 июня 2018

Это мой роутер / index.js 

import Vue from 'vue'
import Router from 'vue-router'
import Home from '../views/Home'
import Login from '../views/Login'

Vue.use(Router)

export default new Router({
  //mode: 'hash',
  routes: [
    {
      path: '/',
      component: Home
    },
    {
      path: '/login',
      component: Login
    },
  ]
})

А это мой логин 

<template>
  <div class="page">
    <p>
    Login
    </p>
  </div>
</template>

<script>
export default {
  components: { }
}

</script>

Но где бы я ни находился, http://127.0.0.1:4000/login http://127.0.0.1:4000/home http://127.0.0.1:4000/asdasdf он отображает домашний шаблон, чего мне не хватает?

это мой app.js 

import Vue from 'vue'
import { sync } from 'vuex-router-sync'
import App from './components/App'
import router from './router'
import store from './store'

sync(store, router)

const app = new Vue({
  router,
  store,
  ...App
})

export { app, router, store }

Я запускаю сервер разработки с 

npm run dev

Если я изменяю домашний шаблон, я вижу изменения, но кажется, что маршрутизация не работает для / login или других представлений.

1 Ответ

0 голосов
/ 26 июня 2018

Добавьте <router-view></router-view> в ваш основной компонент (App.vue): 

<template>

  <!-- html elements of the App.vue page -->

  <!-- router component -->
  <router-view></router-view>

</template>

И укажите режим истории в вашем роутере: 

export default new Router({
  mode: 'history',
  routes: [
  ...
...