【vue】elementUI報錯：_self.$scopedSlots.default is not a function

Vue 會盡量高效地渲染元素，一般會複用已有元素而不是從頭開始渲染。

這樣也不老是符合實際需求，因此 Vue 爲你提供了一種方式來表達「這兩個元素是徹底獨立的，不要複用它們」。只需添加一個具備惟一值的 key 屬性便可。見詳情

錯誤代碼

<!-- 代碼塊1 -->
<el-table-column label="授信申請狀態" v-if="type">
  <template slot-scope="scope">{{ scope.row.data2 | format }}</template>
</el-table-column>
<!-- 代碼塊2 -->
<el-table-column prop="data1" label="聯繫人手機" v-else></el-table-column>

報錯分析

若是優先顯示代碼塊1，而後改變type值，顯示代碼塊2，這時Vue爲了快速渲染頁面，會優先拿代碼1的代碼渲染到代碼塊2的位置，可是代碼塊2並無定義 slot-scope ，這時就會報標題錯誤。

解決方案

1. 給使用 v-if 和 v-else 的地方加上 key
2. 將 v-if 和 v-else 換成 v-show

我的博客：午後南雜