凌的博客

您现在的位置是: 首页 > 前端学习 > Vue > 

Vue

Vue 3.0 第三章 vue-router

2022-06-16 Vue 495

安装:

yarn add vue-router


image.png


index.js

import {createRouter, createWebHashHistory} from "vue-router";

import Home from '../views/Home.vue'

const routes = [
    {
        path: '/',
        name: 'Home',
        component: Home
    }
]

const router = createRouter({
    history: createWebHashHistory(),
    routes
})

export default router


home.vue

<template>
  <div id="nav">
    <router-link to="/">Home</router-link>
  </div>
  <router-view />
</template>
<script>
export default {

}
</script>


App.vue

<template>
  <transition name="el-fade-in-linear">
    <router-view></router-view>
  </transition>
</template>
<script></script>
<style></style>

main.js

import { createApp } from 'vue'
import App from './App.vue'
import router from "./router"
const app = createApp(App)
app.use(router)
app.mount('#app')



文章评论

0条评论