vue如何使用element ui表格el-table-column在里面做判斷
更新時間:2024年08月10日 09:41:58 作者:我的86呢!
這篇文章主要介紹了vue如何使用element ui表格el-table-column在里面做判斷問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
使用element ui表格el-table-column在里面做判斷
第一種
效果:
第二種
效果:
代碼:
//第一種 <el-table-column prop="status" label="樣本狀態(tài)" width="180"> <template slot-scope="scope"> <span v-show="scope.row.status==1">已取樣</span> <span v-show="scope.row.status==2">實驗室處理中</span> <span v-show="scope.row.status==3">測序中</span> <span v-show="scope.row.status==3">數(shù)據(jù)分析中</span> <span v-show="scope.row.status==3">已完成</span> </template> </el-table-column> //第二種 <el-table-column prop="type" label="樣本類型" :formatter="sample"> <!-- <template slot-scope="scope"> <span v-show="scope.row.type==1">血液</span> <span v-show="scope.row.type==2">尿液</span> <span v-show="scope.row.type==3">唾液</span> </template> --> </el-table-column> sample(row, column, cellValue) { if (cellValue == '1') { return '血液' } else if (cellValue == '2') { return '尿液' } else { return '唾液' } },
總結(jié)
以上為個人經(jīng)驗,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
axios請求頭設(shè)置常見Content-Type和對應參數(shù)的處理方式
這篇文章主要介紹了axios請求頭設(shè)置常見Content-Type和對應參數(shù)的處理方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03在vue中created、mounted等方法使用小結(jié)
這篇文章主要介紹了在vue中created、mounted等方法使用小結(jié),具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07vue中對象的賦值Object.assign({}, row)方式
這篇文章主要介紹了vue中對象的賦值Object.assign({}, row)方式,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-03-03vue2.0使用swiper組件實現(xiàn)輪播的示例代碼
下面小編就為大家分享一篇vue2.0使用swiper組件實現(xiàn)輪播的示例代碼,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03Vue3監(jiān)聽屬性與Computed的區(qū)別詳解
在 Vue 3 中,watch 和 computed 都是非常重要的概念,它們都可以用于觀察和響應數(shù)據(jù)的變化,但在使用場景和原理上存在明顯的區(qū)別,本文將詳細解析 Vue 3 中監(jiān)聽屬性 (watch) 和計算屬性 (computed) 的區(qū)別,需要的朋友可以參考下2024-02-02Vue中addEventListener()?監(jiān)聽事件案例講解
這篇文章主要介紹了Vue中addEventListener()?監(jiān)聽事件案例講解,包括語法講解和事件冒泡或事件捕獲的相關(guān)知識,本文結(jié)合示例代碼給大家講解的非常詳細,需要的朋友可以參考下2022-12-12