源自：https://cn.vuejs.org/v2/guide/index.html

動態(tài)組件

<!-- 失活的組件將會被緩存！--> （keep-alive）

<keep-alive>

????????????<component v-bind:is="currentTabComponent"></component>

</keep-alive>

異步組件

Vue 只有在這個組件需要被渲染的時候才會觸發(fā)該工廠函數(shù)，且會把結(jié)果緩存起來供未來重渲染。

new Vue({

? // ...

? components: {

? ? 'my-component': () => import('./my-async-component')

? }

})

處理加載狀態(tài)

const AsyncComponent = ()=> ({

????????? // 需要加載的組件 (應該是一個 `Promise` 對象)

?????????component: import('./MyComponent.vue'),

????????? // 異步組件加載時使用的組件??

????????loading: LoadingComponent,

????????? // 加載失敗時使用的組件??

????????error: ErrorComponent,

? ????????// 展示加載時組件的延時時間。默認值是 200 (毫秒)??

????????delay: 200,

? ????????// 如果提供了超時時間且組件加載也超時了，? // 則使用加載失敗時使用的組件。默認值是：`Infinity`??

????????timeout: 3000

})

注意：

$refs?只會在組件渲染完成之后生效，并且它們不是響應式的。這僅作為一個用于直接操作子組件的“逃生艙”——你應該避免在模板或計算屬性中訪問?$refs。