1、在.vue檔案中動態引進元件
2、在.vue檔案中動態引進js模組檔案
一、動態引進元件
動態引進元件原因：在實際業務中，比如訂單詳情頁面detail.vue，裡面包含了多個第三業務的訂單詳情，但是不同的業務詳情頁面區別又很大，所以只能根據不同的業務**，書寫不同的詳情元件，在根據業務**展示相應的元件
問題：如果詳情對接的業務**越來越多，並且不同的**對於詳情頁面定製化需求又高，這樣就會增加越來越多的元件，如果在頁面都是直接引進元件，那麼沒用到的元件就會造成資源浪費，導致頁面檔案大，並在載入時間變長
一般寫法如下,頁面中用到的元件都直接引進來
show another something
動態引進元件語法：
a）在components屬性裡面用這種方式引進元件：bcomponent: () =>
b）在template中用v-if控制展示：
c）在符合的條件下將isshowbcomponent設定為true
show another something
1、當路由放在裡面，則vue檔案裡面就有activated屬性
2、如果bcomponent裡面有activated屬性
動態引進的化，bcomponent的activated裡面的方法就不會執行
components:動態引進activated裡面的方法不執行原因：
在初始化元件的宣告週期方法的時候，就會對activated進行收集，如果是動態引進，則當檔案載入完成時候，已經過了activated進行收集的時機，那麼自然bcomponent的activated裡面的方法不會執行
二、在.vue檔案中動態引進js模組檔案
動態引進原因：比如payresult.vue檔案表示支付結果頁面，現實中我們有很多第三方業務場景在支付完成之後跳轉到支付結果頁面，在該頁面不同的第三方業務會有一些個性化的需求，比如a、b業務需要做分享功能，c業務不需要做分享功能，這時候我們將分享功能的一些邏輯處理放在了handle.js檔案裡面，share.vue表示分享元件。這時候如果不區分業務**，一進頁面統一載入handle.js share.vue元件，那麼c業務本身不需要分享功能，但也載入了分享的相關檔案，這會造成不必要的資源載入，浪費頁面渲染效能
動態引進大概流程
1）一般進頁面可能會調相應的介面拿資料，比如訂單詳情介面，該介面返回的資料可能有可以區分業務**的字段，比如processno
2）可以根據processno來動態引進handle.js
3）動態引進js檔案語法：import('./share.js').then(res => {})，res為object，是share.js匯出的內容，如果有具名匯出為aa和預設匯出，則結果為res.default，res.aa
示例**如下：
payresult.vue
export default ,
closeevent: () => ,
getsetdaijiadata(vm) ).catch(err => )
},getsetbatterydata(vm) ).catch(err => )
},}
Vue專案引進ElementUI元件的方法
環境要求 nodejs nodejs 開啟cmd命令列，輸入npm v，如果出現如下圖的顯示，說明已經安裝正確。如果安裝版本比較老，想公升級新版本 npm install npm g 安裝 webpack 安裝webpack npm install webpack g g 表示安裝為全域性 安裝 v...
Vue 動態元件
vue.js提供了乙個特殊的元素用來動態掛載不同的元件，使用is特性來選擇要掛載的元件 is current component click change a 切換到a元件button click change b 切換到b元件button click change c 切換到c元件button d...
vue 動態元件
看例子 one component div js 部分 newvue two thr 上面 註冊了三個元件，在 component 標籤裡有個屬性 is，is one，所以頁面會渲染名字叫 one 的元件，顯示結果如下 我是線路一 如果給 is 屬性繫結動態值，那麼就可以實現元件的動態切換，例子如下...