Element UI 表格动态隐藏列:根据条件隐藏标题字段列
<el-table-column\n v-for="(col,index) in dataFilter"\n :key="col.id+index"\n :label="col.name"\n :min-width="col.minWidth"\n :width="col.width"\n :prop="col.code"\n :align="col.align"\n :sortable="col.sortable"\n :show-overflow-tooltip="col.code === 'title' ? a === '1' : true">\n\n\n\n要实现根据条件隐藏标题字段列,可以使用v-if指令在el-table-column中进行判断。根据题目描述,当a属性的值为1时,显示标题字段列,否则隐藏。\n\n修改el-table-column代码如下:\n\nhtml\n<el-table-column\n v-for="(col,index) in dataFilter"\n :key="col.id+index"\n :label="col.name"\n :min-width="col.minWidth"\n :width="col.width"\n :prop="col.code"\n :align="col.align"\n :sortable="col.sortable"\n :show-overflow-tooltip="col.code === 'title' ? a === '1' : true">\n</el-table-column>\n\n\n在这个例子中,通过三元表达式判断col.code是否为'title',如果是,则判断a属性的值是否为1,如果是,则设置show-overflow-tooltip为true,显示标题字段列;如果不是,设置show-overflow-tooltip为false,隐藏标题字段列。对于其他字段列,设置show-overflow-tooltip为true,保持原来的显示。\n\n这样就可以根据a属性的值来动态显示或隐藏标题字段列了。
原文地址: https://www.cveoy.top/t/topic/pKiO 著作权归作者所有。请勿转载和采集!