700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > element自定义table表头筛选图标

element自定义table表头筛选图标

时间:2022-02-01 19:59:13

相关推荐

element自定义table表头筛选图标

// 自定义表头headerData: [{label: '项目类型',prop: 'projectType',select: true,selectValue: [],selectOptions: [{value: 'Vue',label: 'Vue'},{value: 'React',label: 'React'},{value: 'Angular',label: 'Angular'}]},{label: '需求部门',prop: 'demand',select: true,selectValue: [],selectOptions: [{value: '客户经营部',label: '客户经营部'},{value: '零售金融部',label: '零售金融部'}]},{label: '所属团队',prop: 'demand',select: true,selectValue: [],selectOptions: [{value: 'Vue',label: 'Vue'},{value: 'React',label: 'React'},{value: 'Angular',label: 'Angular'}]},{label: '状态',prop: 'status',select: true,selectValue: [],selectOptions: [{value: 'Vue',label: 'Vue'},{value: 'React',label: 'React'},{value: 'Angular',label: 'Angular'}]}],// 页面<!-- <template v-for="(headerItem, headerIndex) in headerData">// 多选框选择器<el-table-column v-if="headerItem.select" :label="headerItem.label" :prop="headerItem.prop" :key="headerIndex">// 表头的 slot<template #header><el-popover placement="bottom" title="" width="200" trigger="click"><div slot="reference" class="search-header"><span class="search-title">{{ headerItem.label }}</span><span class="iconCss"><img src="@/assets/filters.png" alt="" /></span></div><el-checkbox-group v-model="headerItem.selectValue"><el-checkboxv-for="item in headerItem.selectOptions":value="item.value":label="item.label":key="item.value">{{ item.label }}</el-checkbox></el-checkbox-group><el-button size="mini">筛选</el-button><el-button size="mini" @click="reset(headerIndex)">重置</el-button></el-popover></template>// 表格的 内容 slot<template slot-scope="scope"><div class="aaa">{{ scope.row[headerItem.prop] }}</div><span v-if="scope.row[headerItem.prop] == '1'" class="color1"><i class="circle1"></i>未开始</span><span v-if="scope.row[headerItem.prop] == '2'" class="color2"><i class="circle2"></i>活动中</span><span v-if="scope.row[headerItem.prop] == '3'" class="color3"><i class="circle3"></i>维护中</span></template></el-table-column></template> -->

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。