色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

vue cli多頁面

劉柏宏2年前8瀏覽0評論

Vue CLI提供了非常方便的多頁面應用程序(MPA)的開發。MPA是指包含多個HTML文件的應用程序,每個HTML文件都對應一個獨立的Vue實例。這種開發方式適用于那些需要使用多個互相獨立的頁面,每個頁面中只能有一個Vue實例的場景。

Vue CLI的多頁面模板已經默認支持了MPA開發。我們通過執行以下命令即可創建一個基本的多頁面應用程序:

vue create my-multipage-app # 創建項目
cd my-multipage-app # 進入項目目錄
vue add @vue/cli-plugin-multi-page # 安裝多頁面插件

上述命令執行之后,我們就可以創建多個HTML文件了。我們可以在/public目錄下新建一個about.html文件,里面的代碼如下:

About

About

{{ message }}

通過{{ message }}我們可以向/src/pages/About.vue文件中傳遞數據。上述代碼還引入了一個新的腳本文件about.js,我們需要在/src/main.js文件中告訴Vue CLI如何處理這個文件。我們可以按如下代碼編輯/src/main.js文件:

import Vue from 'vue'
import App from './App.vue'
Vue.config.productionTip = false
let routes = {
'about': {
template: '',
components: { App  }
}
}
new Vue({
el: '#app',
components: { App },
template: '',
router: new VueRouter({ routes })
}).$mount('#app')

在上面的代碼中我們使用VueRouter來實例化一個路由器,通過routes參數我們可以指定哪個組件對應哪個頁面。

通過以上步驟,我們就已經創建了一個基本的多頁面Vue應用程序。