vue中會使用官方提供的vue-router外掛程式來使用單頁面，原理就是通過檢測位址列變化後將對應的路由元件進行切換（解除安裝和安裝）
spa vs mpa
組成乙個外殼頁面和多個頁面片段組成
多個完整頁面構成
資源共享（css、js）
共用只需要在外殼部分載入
不共用，每個頁面都需要載入
重新整理方式
頁面區域性重新整理或更改
整頁重新整理
url模式
使用者體驗
頁面片段切換快，使用者體驗好
頁面切換載入緩慢，流暢度不夠使用者體驗較差
轉場動畫
容易實現
無法實現
資料傳遞
容易依賴url傳參、或者cookie、
localstorage等
搜尋引擎優化（seo）
需要單獨方案、實現較為困難、不利於seo檢索 可以利用伺服器端渲染（ssr）優化
實現方法簡易
適用範圍
高要求的體驗度，追求介面流暢的應用
適用於追求高度支援搜尋引擎的應用
開發成本
較高，常需借助專業的框架
較低，但頁面重複**多
維護成本
相對容易
相對複雜
SPA與MPA的優缺點
開場 在逆戰班學習中，了解到了spa和mpa，這裡就總結了一下他們的優缺點。優點 1.使用者體驗好，流暢。2.因為是單頁面，所以對伺服器的壓力較小。3.可以在頁面切換的時候增加一些炫酷的動畫效果。4.的可復用，且由於是元件化開發，有利於後期的維護。缺點 1.頁面複雜度變大，開發難度較大。2.不利於s...
多頁面應用MPA與單頁面應用SPA的區別
通俗一點說就是指只有乙個主頁面的應用，瀏覽器一開始要載入所有必須的 html,js,css。所有的頁面內容都包含在這個所謂的主頁面中。但在寫的時候，還是會分開寫 頁面片段 然後在互動的時候由路由程式動態載入，單頁面的頁面跳轉，僅重新整理區域性資源。多應用於pc端。多頁面 mpa 就是指乙個應用中有多...
前端的單頁面模式SPA和多頁面模式MPA
前端部分的搭建，需要考慮使用哪種模式進行頁面之間的跳轉互動，而專案內的頁面互動，不可避免的需要相互之間的資料共享。這就引出了本篇部落格的目的，一起來談談 專案前端部分的構建方式以及資料共享方式。1 方便性 結合開發的時間需求和方便性選擇適合的前端模式 2 效能 在專案的體量比較大，或者某個頁面需要載...