Elementui中ref和scope的使用

ref一般写在el-form中,以作为验证表单时使用
<el-form

    :model="ruleForm"
    :rules="rules"
    ref="ruleForm"
    label-width="250px"
    class="demo-ruleForm"
  >

</el-form-item>
在调接口前作验证
this.$refs[formName].validate(valid => {

    if (valid) {
      console.log("11");
      upDataPc(updateAddinfo).then(res => {
          this.resetForm(formName);
          this.$message.success("修改批次成功");
          this.addBatchDialog = false;
          this.getBatchList();
      });

在el-table-column中可以添加template插槽通过scped.row加属性拿到data中的对应数据

 <el-table-column prop="bzftype" label="保障房类型" align="center">
    <template slot-scope="scope">
      <span v-if="scope.row.bzftype == 0">公共租赁住房</span>
      <span v-if="scope.row.bzftype == 1">廉租住房</span>
    </template>
  </el-table-column>
  <el-table-column prop="stime" label="开始日期" align="center"></el-table-column>
  <el-table-column prop="etime" label="结束日期" align="center"></el-table-column>
  <el-table-column label="操作" align="center">
    <template slot-scope="scope">
      <el-button @click="updateBatch(scope.row.id)" type="text" size="small">编辑</el-button>
      <span v-if="scope.row.sfysy==0">|</span> 
      <el-button v-if="scope.row.sfysy==0" @click="deleteBatch( scope.row.id)" type="text" size="small">删除</el-button>
    </template>
  </el-table-column>

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理