Table highlighting or font color change operations in vue+elementUI

Key code:

: row-style= "setRowStyle" This attribute is bound on the table tag

:row-style="setRowStyle"

//  This method is added directly to the methods It will be fine, and the page will be called automatically 
setRowStyle(row) {
   if (row.row.isPart == true) {
    return 'color:blue;'
   }
  },

Specific code:

hmtl

<el-table width="100%" :data="gridData" border fit highlight-current-row :header-cell-style="{background:'#199ED8'}" :row-style="setRowStyle">
 <el-table-column label=" Serial number " type="index"></el-table-column>
 </el-table>

In js, it would be nice to call a method

setRowStyle(row) {
   if (row.row.isPart == true) {
    return 'color:blue;'
   }
  },

Supplementary knowledge: el-input of vue+element-ui form cannot be entered for second modification

Since the same pop-up window is used for adding and modifying, the value in input box should be cleared when modifying and submitting.

You cannot only set the parent object formData to an empty object when committing. That is, this. formData = {} is wrong

The correct way to write it is

this.formData = {name: '' }

Reason: If this. formData is set to null, this. formData. name is undefined, which will not be assigned.

   <el-form ref="popupContent" :model="formData" :rules="popupContentRules">
    <el-row>
     <el-form-item label=" Name " label-width="80px" prop="name">
      <el-input name="name" @keyup.native="judge" v-model="formData.name"/>
     </el-form-item>
    </el-row>
   </el-form>