el-table必填列红色显示
时间: 2024-05-29 07:07:38 浏览: 71
在Element UI的表格组件el-table中,我们可以通过设置列的属性来实现必填列的红色显示。具体方法如下:
1. 在el-table-column标签中,设置prop属性对应的字段为必填项。
2. 在该列的header slot中,添加必填项标记。
3. 在该列的表格单元格template中,添加必填项标记和校验提示信息。
示例代码如下:
```
<el-table :data="tableData">
<el-table-column prop="name" label="姓名">
<template slot="header">
<span>姓名<span style="color:red">*</span></span>
</template>
<template slot-scope="scope">
<el-form-item prop="name" :rules="[{ required: true, message: '请输入姓名', trigger: 'blur' }]">
<el-input v-model="scope.row.name" placeholder="请输入姓名"></el-input>
</el-form-item>
</template>
</el-table-column>
</el-table>
```
相关问题:
1. Element UI中如何设置表格必填列红色显示?
2. 如何在表格中添加校验提示信息?
3. 如何设置表格列的宽度?
阅读全文
相关推荐













