Vue中的動態元件

2021-10-23 09:06:09 字數 821 閱讀 2219

1,定義:

2,使用:

元素是vue 裡面的乙個內建元件。在裡面使用 v-bind: is,可以實現動態元件的效果。

"currentcomponent"

>

3,例子:

<

!-- * @descripttion: vue動態元件

* @version:

* @author: zhangfan

* @email: [email protected]

* @date: 2020-07-03 09:10:28

* @lasteditors: zhangfan

* @lastedittime: 2020-07-13 17:10:31

-->

"container"

>

"currenttabcomponent"

>

"(item,index) in grouplist" :key=

"index"

>

"primary" @click=

"choosencomp(item)"

>

}

4,在動態元件上使用 keep-alive:

<

!-- 失活的元件將會被快取!-->

"currenttabcomponent"

>

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 屬性繫結動態值,那麼就可以實現元件的動態切換,例子如下...

vue動態元件 非同步元件

重新建立動態元件的行為通常是非常有用的,但是在這個案例中,我們更希望那些標籤的元件例項能夠被在它們第一次被建立的時候快取下來。為了解決這個問題,我們可以用乙個元素將其動態元件包裹起來。v bind is currenttabcomponent component keep alive 注意 這個要求...