bl双性强迫侵犯h_国产在线观看人成激情视频_蜜芽188_被诱拐的少孩全彩啪啪漫画

vue實(shí)現(xiàn)單頁應(yīng)用改成多頁應(yīng)用的方法-創(chuàng)新互聯(lián)

vue 實(shí)現(xiàn)單頁應(yīng)用改成多頁應(yīng)用的方法?相信很多沒有經(jīng)驗(yàn)的人對此束手無策,為此本文總結(jié)了問題出現(xiàn)的原因和解決方法,通過這篇文章希望你能解決這個(gè)問題。

為茂名等地區(qū)用戶提供了全套網(wǎng)頁設(shè)計(jì)制作服務(wù),及茂名網(wǎng)站建設(shè)行業(yè)解決方案。主營業(yè)務(wù)為網(wǎng)站設(shè)計(jì)制作、成都網(wǎng)站制作、茂名網(wǎng)站設(shè)計(jì),以傳統(tǒng)方式定制建設(shè)網(wǎng)站,并提供域名空間備案等一條龍服務(wù),秉承以專業(yè)、用心的態(tài)度為用戶提供真誠的服務(wù)。我們深信只要達(dá)到每一位用戶的要求,就會得到認(rèn)可,從而選擇與我們長期合作。這樣,我們也可以走得更遠(yuǎn)!

簡單分析下需求,就是,項(xiàng)目A/B/C的內(nèi)容是交叉的,有的頁面不同,有的頁面和組件是公用的,例如A項(xiàng)目多了個(gè)人中心及其里面所有內(nèi)容(最全的一個(gè)項(xiàng)目,但是是放在微信中的,需要獲取微信授權(quán)),B項(xiàng)目是通用版的項(xiàng)目(也就是說可以放在微信,也可以放在app內(nèi),不需要獲取授權(quán)之類的。),C項(xiàng)目是A/B項(xiàng)目中共有的一個(gè)頁面功能抽取出來了。
所以有的時(shí)候比如說這塊功能需要調(diào)整,那么就得A/B/C三個(gè)項(xiàng)目關(guān)于這塊的功能與頁面也要一起調(diào)整。
動(dòng)態(tài)化組件的意思就是,D頁面由組件1234按照這樣的順序排列構(gòu)成,同時(shí)D頁面也供機(jī)構(gòu)5、6、7共同使用,但是機(jī)構(gòu)6突然想要2134這樣的順序,機(jī)構(gòu)7又想要4132這樣的順序。代碼依舊是一套,而不是重新拉個(gè)分支,然后這個(gè)分支將D頁面改成2134給機(jī)構(gòu)6,再拉個(gè)分支將D頁面改成4132給機(jī)構(gòu)7。這樣做會增加服務(wù)器的壓力,每次機(jī)構(gòu)有定制化需求就重新拉分支的話,機(jī)構(gòu)很多的話,容量會不夠的。
(好像篇幅有點(diǎn)長,,扯得有點(diǎn)多了)

關(guān)于動(dòng)態(tài)組件

這一塊簡單說一下,如果有不懂的,可以留言,我會把我知道的說出來,我這一塊做的主要是<components :is="xxx">配合vuex,來做的。
前端頁面改成上述模式,具體的組件排列順序由后臺傳過來,比如說請求接口的時(shí)候,告訴它這是在D頁面,并且把相應(yīng)的機(jī)構(gòu)號6傳過去,后臺傳給我一個(gè)組件數(shù)組,moduleList:['2', '1', '3', '4'],然后我前端的<components :is="item" v-for="(item, index) in moduleList" :key="index">會按照moduleList里的組件順序來動(dòng)態(tài)渲染組件,之前一些父子組件傳數(shù)據(jù),在這里就變得不太適用了,所以這里的數(shù)據(jù)改用vuex存儲。考慮到vuex在刷新數(shù)據(jù)丟失的問題,部分比較重要的,不想重新請求的,改用sessionStorage存儲。

關(guān)于多入口多出口

其實(shí)就是最開始的項(xiàng)目入口是App.vuemain.js,打包出來的出入口是index.html,然后現(xiàn)在增加了兩個(gè),我這邊是增加了genneral.js和genneral.html以及single.jssingle.html

1.首先要更改vue-cli生成的webpack里的參數(shù),聲明一下我這個(gè)版本的webpack版本還是2.6.x的,比較老了,現(xiàn)在應(yīng)該都到4.x.x了吧。

vue 實(shí)現(xiàn)單頁應(yīng)用改成多頁應(yīng)用的方法

PS:路由和store記得要各自獨(dú)立,因?yàn)槲疫@里的vuex很少只涉及一兩個(gè)模塊。并且僅僅是傳遞數(shù)據(jù)之類的,所以這里沒有做成獨(dú)立的。

2.修改build/webpack.base.conf.js

vue 實(shí)現(xiàn)單頁應(yīng)用改成多頁應(yīng)用的方法

3.修改 build/webpack.dev.conf.js

vue 實(shí)現(xiàn)單頁應(yīng)用改成多頁應(yīng)用的方法

4.修改 build/webpack.prod.conf.js

vue 實(shí)現(xiàn)單頁應(yīng)用改成多頁應(yīng)用的方法

vue 實(shí)現(xiàn)單頁應(yīng)用改成多頁應(yīng)用的方法

5.修改 config/index.js

vue 實(shí)現(xiàn)單頁應(yīng)用改成多頁應(yīng)用的方法

理一下對應(yīng)關(guān)系

main.js ==> App.vue ==> router/index.js A項(xiàng)目
general.js ==> general.vue ==> router/general.js B項(xiàng)目
single.js ==> single.vue ==> router/single.js C項(xiàng)目

當(dāng)前名稱:vue實(shí)現(xiàn)單頁應(yīng)用改成多頁應(yīng)用的方法-創(chuàng)新互聯(lián)
標(biāo)題鏈接:http://vcdvsql.cn/article48/ppchp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供虛擬主機(jī)全網(wǎng)營銷推廣網(wǎng)站收錄網(wǎng)頁設(shè)計(jì)公司用戶體驗(yàn)網(wǎng)站建設(shè)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

成都seo排名網(wǎng)站優(yōu)化