目录

1-关于el-table复选框中表头和内容不对齐问题

2-日期选择器传值给后端格式不对

3-获取表格的当前行数据#default="{row}"

1-关于el-table复选框中表头和内容不对齐问题

   <el-table
          :data="tableData"
          stripe
          style="width: 100%"
          tooltip-effect="dark"
          @selection-change="handleSelectionChange"
        >
          <el-table-column type="selection" width="55" align="center"> </el-table-column>
          <el-table-column label="日期" width="120">
            <template slot-scope="scope">{{ scope.row.date }}</template>
          </el-table-column>
        </el-table>

直接添加align="center"解决

2-日期选择器传值给后端格式不对

使用 value-format="yyyy-MM-dd HH:mm:ss"

后端需要什么格式你就在value-format属性中修改

 <el-date-picker
                    class="input-box"
                    type="datetime"
                    v-model="ruleForm.birthday"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    placeholder="请选择出生日期"
                  >
                  </el-date-picker>

3-获取表格的当前行数据#default="{row}"

不再使用slot-scope="scope"来获取当前行数据

 <el-table-column fixed="right" label="操作" width="120">
            <template #default="{ row }">
              <el-button
                @click.native.prevent="deleteRow(row.$index, tableData)"
                type="text"
                size="small"
              >
                删除
              </el-button>
            </template>
          </el-table-column>

4-一键清空表单数据

1.给<el-form ref=“formdata” :model="formInline">,添加ref绑定dom

2.在<el-form-item prop="time">，添加prop，prop的值是formInline:{time:“”}的time属性

3.给个重置按钮

        

   <el-form-item>

          <el-button type="primary" @click="onSubmit()">清空</el-button>

        </el-form-item>

4.一键清空表单数据

 onSubmit() {

      this.$refs.formData.resetFields()

    },

5.代码如下

  <el-form ref="formData" :inline="true" :model="formInline" class="demo-form-inline">
  <el-form-item label="系统模块" prop="xit">
          <el-input
            v-model="formInline.xit"
            placeholder="请输入系统模块"
          ></el-input>
        </el-form-item>
  <el-form-item>
          <el-button type="primary" @click="onSubmit()">清空</el-button>
        </el-form-item>

</el-form>

javascript"> onSubmit() {
      this.$refs.formData.resetFields()
    },