vue+elementUI中表格高亮或字體顏色改變操作
重點(diǎn)的代碼：
:row-style="setRowStyle"這個(gè)屬性就是在table標(biāo)簽綁定的
:row-style="setRowStyle"
// 這個(gè)方法直接加到methods里就好了，頁(yè)面會(huì)自動(dòng)調(diào)用的
setRowStyle(row) {
if (row.row.isPart == true) {
return 'color:blue;'
}
},
具體代碼：
hmtl
<el-table width="100%" :data="gridData" border fit highlight-current-row :header-cell-style="{background:'#199ED8'}" :row-style="setRowStyle">
<el-table-column label="序號(hào)" type="index"></el-table-column>
</el-table>
js中就是方法的調(diào)用就好了
setRowStyle(row) {
if (row.row.isPart == true) {
return 'color:blue;'
}
},
補(bǔ)充知識(shí)：vue+element-ui 表單的 el-input 第二次修改時(shí)無(wú)法輸入
由于新增跟修改用的是同一個(gè)彈窗，所以當(dāng)修改提交時(shí)，要清空 input 框內(nèi)的值。
提交時(shí)不能只把 父對(duì)象formData 設(shè)置為空對(duì)象。即this.formData = {} 是錯(cuò)誤的
正確的寫(xiě)法為
this.formData = {name: '' }
原因：如果把this.formData設(shè)置為空，this.formData.name 就是 undefined，此時(shí)就會(huì)賦值不上。
<el-form ref="popupContent" :model="formData" :rules="popupContentRules">
<el-row>
<el-form-item label="姓名" label-width="80px" prop="name">
<el-input name="name" @keyup.native="judge" v-model="formData.name"/>
</el-form-item>
</el-row>
</el-form>
以上這篇vue+elementUI中表格高亮或字體顏色改變操作就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue高德地圖JS API實(shí)現(xiàn)海量點(diǎn)標(biāo)記示例
本文主要介紹了vue高德地圖JS API實(shí)現(xiàn)海量點(diǎn)標(biāo)記示例，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-08-08
基于Vue3自定義實(shí)現(xiàn)圖片翻轉(zhuǎn)預(yù)覽功能
這篇文章主要為大家詳細(xì)介紹了如何基于Vue3自定義實(shí)現(xiàn)簡(jiǎn)單的圖片翻轉(zhuǎn)預(yù)覽功能,文中的示例代碼講解詳細(xì),具有一定的學(xué)習(xí)價(jià)值,有需要的小伙伴可以參考一下2023-10-10
vue.js實(shí)現(xiàn)刷新當(dāng)前頁(yè)面的方法教程
這篇文章主要給大家介紹了關(guān)于vue.js實(shí)現(xiàn)刷新當(dāng)前頁(yè)面的方法教程，文中給出了詳細(xì)的示例代碼供大家參考學(xué)習(xí)，對(duì)大家具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面跟著小編一起來(lái)學(xué)習(xí)學(xué)習(xí)吧。2017-07-07
這篇文章主要介紹了Vue 路由組件傳參的 8 種方式,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-03-03
這篇文章主要介紹了VUE 全局變量的幾種實(shí)現(xiàn)方式,小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-08-08
vue3無(wú)config文件夾打包后頁(yè)面空白問(wèn)題及解決
這篇文章主要介紹了vue3無(wú)config文件夾打包后頁(yè)面空白問(wèn)題及解決，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-05-05
這篇文章主要介紹了Vue的兼容性解決方案Babel-polyfill的相關(guān)知識(shí),本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2023-11-11
vue3.0實(shí)踐之寫(xiě)tsx語(yǔ)法實(shí)例
很久不寫(xiě)博客了,最近在使用ts和tsx開(kāi)發(fā)vue類(lèi)項(xiàng)目,網(wǎng)上資料比較少,順便記錄一下方便同樣開(kāi)發(fā)的人互相學(xué)習(xí)共同進(jìn)步,下面這篇文章主要給大家介紹了關(guān)于vue3.0實(shí)踐之寫(xiě)tsx語(yǔ)法的相關(guān)資料,需要的朋友可以參考下2022-07-07
vue項(xiàng)目中實(shí)現(xiàn)多文件上傳功能實(shí)例代碼
我們平時(shí)經(jīng)常做的是上傳文件,下面這篇文章主要給大家介紹了關(guān)于vue項(xiàng)目中實(shí)現(xiàn)多文件上傳功能的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-11-11
vue子組件如何獲取父組件的內(nèi)容(props屬性)
這篇文章主要介紹了vue子組件獲取父組件的內(nèi)容(props屬性)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04