vue3中使用路由

500 阅读1分钟
import { createApp } from 'vue'
import router from './router'
import App from './App.vue'

const app = createApp(App)
app.use(router)
app.mount('#app')

import { createRouter, createWebHistory, createWebHashHistory } from 'vue-router'
const routes = [
  {
    path: '/',
    redirect: '/home'
  },
  {
    path: '/home',
    component: () => import(/*webpackChunkName:"home-chunk*/ '@/pages/Home.vue')
  },
  {
    path: '/about',
    component: () => import(/*webpackChunkName:"about-chunk*/ '@/pages/About.vue')
  }
]
const router = new createRouter({
  routes,
  history: createWebHashHistory()
})
export default router
<template>
  <div>
    <router-link to="/home">home</router-link>
    <router-link to="/about">about</router-link>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  setup() { },
};
</script>

<style scoped>
</style>