vueプロジェクトでのrouter3とrouter4の書き方！！ご注目ください！！！！

    vue-router のバージョンに注意してください。！！初心者の Xiaobai (私のような!!!) が自分で新しい Index.js ファイルを作成するとき、間違いを犯しやすいのです。！！！

以前、router4版をダウンロードしたのですが、学習を始めた当初からrouter3の書き方を学習してきたので、新規プロジェクトを作成する際もrouter3の書き方に慣れてきました！！！これには本当に注意する必要があります。そうしないと機能しません...

router3の記述方法はvue.use(router)を使用します。

import Vue from 'vue'  //为了使用路由插件
import VueRouter from 'vue-router'  //导入路由
import Home from '../components/HelloWorld' //初始化加载主页面


Vue.use(VueRouter)
var routes = [{
    path: '/',
    name: 'HelloWorld',
    component: Home
},
// {
//     path: '/my',
//     name: 'My',
//     component: () => import('../components/My.vue') 
// }
]

const router = new VueRouter({
routes  //es6的属性增强写法
})

export default router

ルーター4の書き方

import { createRouter, createWebHistory } from 'vue-router'
import HelloWorld from '../components/HelloWorld.vue'
const routerHistory = createWebHistory()
const router = createRouter({
    history: routerHistory,
 routes:[
    {
        path: '/',
        name: 'HelloWorld',
        component: () => import('../components/HelloWorld.vue')
      },
      {
        path: '/h',
        component: HelloWorld   
      },
      {
        path: '/hh',
        name: 'myUser',
        component: () => import('../views/myUser.vue')
      },
 ]
})
 
export default router

 ！！！学習記録１！！！！