使用Vue怎么實(shí)現(xiàn)多系統(tǒng)切換？很多新手對(duì)此不是很清楚，為了幫助大家解決這個(gè)難題，下面小編將為大家詳細(xì)講解，有這方面需求的人可以來(lái)學(xué)習(xí)下，希望你能有所收獲。

成都創(chuàng)新互聯(lián)作為成都網(wǎng)站建設(shè)公司，專注重慶網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)，有關(guān)成都定制網(wǎng)頁(yè)設(shè)計(jì)方案、改版、費(fèi)用等問題，行業(yè)涉及成都除甲醛等多個(gè)領(lǐng)域，已為上千家企業(yè)服務(wù)，得到了客戶的尊重與認(rèn)可。

實(shí)現(xiàn)思路

1.結(jié)合iframe開發(fā)上方系統(tǒng)切換的組件

2.各個(gè)子系統(tǒng)有自己的域名

開發(fā)

因?yàn)槊總€(gè)頁(yè)面都需要這個(gè)切換功能，所以我們直接在app.vue里開發(fā)。我是用vue+element開發(fā)的，所以切換的地方直接用了ele的tab切換組件。(寫法有很多種，主要是思路)
讀完這些話再看代碼，方便理解：
1.如果用v-if控制每個(gè)iframe的顯示隱藏，那么切換后系統(tǒng)后，再切換回來(lái)，iframe的屬性會(huì)使頁(yè)面會(huì)刷新，用戶的操作不能保留
2.如果純粹用elementUi的tab組件來(lái)做，頁(yè)面一進(jìn)來(lái)，就會(huì)把每個(gè)系統(tǒng)的資源加載進(jìn)來(lái)，卡的要命，所以需要做到按需加載
3.實(shí)現(xiàn)：結(jié)合1、2問題，用v-if控制頁(yè)面一進(jìn)來(lái)，只加載一個(gè)默認(rèn)的系統(tǒng)；tab切換的時(shí)候再利用v-if去加載該系統(tǒng)的資源；v-if只控制一次，不會(huì)隨著tab的切換變化，這樣就能保證切換系統(tǒng)時(shí)保留了用戶的操作。

代碼

app.vue

看完上述內(nèi)容是否對(duì)您有幫助呢？如果還想對(duì)相關(guān)知識(shí)有進(jìn)一步的了解或閱讀更多相關(guān)文章，請(qǐng)關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝您對(duì)創(chuàng)新互聯(lián)的支持。

新聞標(biāo)題：使用Vue怎么實(shí)現(xiàn)多系統(tǒng)切換-創(chuàng)新互聯(lián)
URL鏈接：http://weahome.cn/article/eeeic.html