前言
在使用 element ui 的el-table 組件時,表頭應用v-if判斷來動態顯示,正常來說這樣的操作是沒有問題的,但是如果在這基礎上使用 <template slot-scope="scope">
操作的話,表頭一旦切換就會報錯,錯誤信息如下:
_self.$scopedSlots.default is not a function
解決方法
在v-for或者v-if切換標籤時,多個相同的標籤被渲染,如果不添加key來區分則會出現複用的情況。而原本這些標籤每一個都是獨立的,故需要添加key來做區分!
給包含 <template slot-scope="scope">
的<el-table-column>
標籤列加上屬性 key 屬性。如無唯一標識,可應用:key=Math.random()
.
原理解析
官方提示用key屬性管理複用元素