vue多頁面與單頁面開發的區別。


進入一家新的公司,要開發移動端app項目,前端技術選型時前端組長選的是vue的多頁面開發,當時很蒙,vue不是單頁面開發嗎?咋出來多頁面的。接觸之后才發現確實存在也挺簡單的,省去了路由表的配置。那就給大家整體思路分析一波吧。不足之處還請包涵!

單頁面開發我就不多說了,主要講多頁面的開發模式與最終效果,網上一搜單頁面會有好多文章博客,但是搜多頁面的就很少了,比如下面這個就是列了一下兩種開發模式的優缺點。

 

首先多頁開發,肯定是一個頁面就是一個單獨文件,每個文件也有自己的.vue .js 和compoent自身組件,如下page里的一個文件就是一個頁面。

 

 那這么多頁面之間如果有參數需要互相傳遞,這時就只能借用localStorage本地存儲了,或者封裝一個全局傳參方法,掛載注冊到main.js里,我是封裝的localStorage方法。

如果頁面之間相互跳轉,沒有單頁面路由了,那就只能是window.location.href了,alertDialog里的哪個app.openView是安卓跳轉方法,其實就相當於下面的注釋。

 

 那么這些頁面最終也需要打包,最核心的就是下面方框里的代碼了,chunk最終就是每個頁面的文件名,對應的就是文件名.html.

glob是打包多頁面的一個方案插件,最后把pages對象拋出就行了。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



猜您在找 單頁面和多頁面開發的區別 Vue2, Vue3 開發單一html頁面區別 Vue前端頁面開發 使用 Vue 開發 Weex 頁面 vue2.0多頁面開發 Vue多頁面開發案例 vue之多頁面的開發 vue單頁面開發和多頁面開發的概念,及優缺點? Vue 子路由 與 單頁面多路由 的區別 vue開發筆記(二)—— 頁面全屏放大、element使用、