目录
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> onSubmit() {
this.$refs.formData.resetFields()
},
