Как я могу перенаправить, используя vue -router? - PullRequest
Новая
       7

Как я могу перенаправить, используя vue -router?

0 голосов
/ 19 февраля 2020

Я пытался получить доступ к другим страницам через URL, но эти страницы никогда не загружаются

Это мой основной файл. js 

import Vue from 'vue'
import App from './App.vue'
import vuetify from './plugins/vuetify';
import VueRouter from 'vue-router'

Vue.config.productionTip = false

Vue.use(VueRouter)

import Index from './views/Index';
const About = { template: '<p>about page</p>' }

const routes = [
  { path: '/index', name: 'index', component: Index },
  { path: '/about', name: 'about', component: About }
]

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

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

Кто-нибудь может мне помочь с vue -рутером? я новичок в этих рамках

1 Ответ

1 голос
/ 19 февраля 2020

Работает ли это, если вы обращаетесь к ним следующим образом:

http://localhost: 8080 / # / about

Если да, ваш vue-router работает в по умолчанию га sh -режим . Чтобы избавиться от ха sh и получить «нормальные» URL-адреса, вам нужно установить для него режим истории .

Редактировать:

Как я вижу, вы уже используете режим истории. Используете ли вы Vue CLI для локальной разработки? Это должно обычно работать из коробки . Если нет, вам нужно настроить некоторые правила перенаправления на других веб-серверах. Смотрите примеры здесь: Примеры конфигураций сервера

Редактировать 2: Можете ли вы показать свой App компонент? Я попытался воспроизвести вашу проблему в песочнице, но она работает: https://codesandbox.io/s/confident-voice-zyg07

Компонент App здесь выглядит следующим образом, включая представление маршрутизатора: 

<template>
  <div id="app">
    <router-view id="page"/>
  </div>
</template>

<script>
export default {
  name: "App",
  components: {}
};
</script>
...