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">實(shí)驗(yàn)室處理中</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)驗(yàn)，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
本篇文章主要介紹了Vuex之理解state的用法實(shí)例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-04-04
vue裁切預(yù)覽組件功能的實(shí)現(xiàn)步驟
這篇文章主要介紹了vue裁切預(yù)覽組件功能的實(shí)現(xiàn)代碼，本文通過實(shí)例代碼相結(jié)合的形式給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值,感興趣的朋友跟隨腳本之家小編一起學(xué)習(xí)吧2018-05-05
UniApp加載Web頁面完整實(shí)現(xiàn)方案(附實(shí)例代碼)
在uniapp中加載外部網(wǎng)頁,可以通過使用web-view組件來實(shí)現(xiàn),web-view是一個web瀏覽器組件,可以用來承載網(wǎng)頁的容器,這篇文章主要介紹了UniApp加載Web頁面完整實(shí)現(xiàn)方案的相關(guān)資料,需要的朋友可以參考下2025-09-09
VUE Error: getaddrinfo ENOTFOUND localhost
這篇文章主要介紹了VUE Error: getaddrinfo ENOTFOUND localhost，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-05-05
這篇文章主要為大家詳細(xì)介紹了如何基于Vue開發(fā)一個很火的卡片動畫效果,大致包含兩個效果,光的跟隨效果還有卡片傾斜像?3D?的效果,感興趣的可以了解一下2024-02-02
這篇文章主要為大家詳細(xì)介紹了vue移動端實(shí)現(xiàn)手指滑動效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-06-06
本篇文章主要介紹了vue中配置mint-ui報css錯誤問題的解決方法，非常具有實(shí)用價值，需要的朋友可以參考下2017-10-10
這篇文章主要介紹了vue鍵盤事件keyup、keydown的作用,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-12-12
Vue.js樣式動態(tài)綁定實(shí)現(xiàn)小結(jié)
這篇文章主要介紹了Vue.js樣式動態(tài)綁定實(shí)現(xiàn)小結(jié)，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-01-01
使用Vue.js實(shí)現(xiàn)一個循環(huán)倒計時功能
在Web應(yīng)用中,倒計時功能常用于各種場景,如活動倒計時、定時任務(wù)提醒等,Vue.js作為一款輕量級的前端框架,提供了豐富的工具和API來實(shí)現(xiàn)這些功能,本文將詳細(xì)介紹如何使用Vue.js實(shí)現(xiàn)一個循環(huán)倒計時功能,需要的朋友可以參考下2024-09-09