vue-roouter를 사용하여 리디렉션하려면 어떻게 해야 하는가?

vue-roouter를 사용하여 리디렉션하려면 어떻게 해야 하는가?

나는 URL을 통해 다른 페이지에 액세스하려고 노력했지만, 그 페이지는 로드되지 않는다.

• http://localhost:8080/index
• http://localhost:8080/정보

이것은 나의 main.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')

누가 부에루터 좀 도와줄래?나는 이 틀에서 새로운 사람이다.

다음과 같이 액세스하면 작동하는지 여부:

http://localhost:8080/#/정보

만약 그렇다면, 당신의vue-router기본 해시 모드에서 작동 중.해시를 제거하고 "정상" 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>

참조URL: https://stackoverflow.com/questions/60294955/how-can-i-redirect-using-vue-router