我們已經創(chuàng)建好了一個Vue項目工程,首先我們采用NPM的方式來安裝Vue。打開IDEA的終端面板,使用終端在根目錄下執(zhí)行如下指令來安裝vue router模塊:
npm install vue-router@4 -s
若安裝成功,項目的package.json文件中會自動添加Vue Router的依賴。例如:
"dependencies": {
"axios": "^1.3.5",
"core-js": "^3.8.3",
"vue": "^3.2.13",
"vue-axios": "^3.5.2",
"vue-router": "^4.1.6"
},
成功添加依賴后,便可以對Vue Router進行使用了。其中心思想是將定義好的Vue組件綁定到指定的路由,然后通過路由指定在何時何處渲染這個組件。
首先,在工程的components文件夾下新建兩個文件,分別命名為MyDemo1.vue和MyDemo2.vue,分別編寫如下代碼:
MyDemo1.vue
頁面一
MyDemo2.vue
頁面二