?可展示圖片，
可使用slot插槽添加邏輯，
循環表cloumn，
循環添加操作配置actionButtons
<el-tablev-loading="loading":data="tableData"borderstyle="width: 100%"@selection-change="selectChange"><el-table-column type="selection" width="55"> </el-table-column><el-table-columnv-for="(item, index) in tableColumn":key="index":width="item.width":fixed="item.fixed":type="item.type":label="item.label":prop="item.prop":sortable="item.sortable":align="item.align || 'center'"><template v-slot="scope"><!-- 如果是索引列，顯示行號 --><span v-if="item.type === 'index'">{{ scope.$index + 1 }}</span><!-- 如果是圖片列，展示圖片 --><span v-else-if="item.prop === 'fileThumb'"><imgv-if="scope.row[item.prop]":src="scope.row[item.prop]"alt="圖片"style="width: 50px; height: 50px; object-fit: cover"/><!-- <img v-else :src="" alt=""> --></span><!-- 其他列使用自定義插槽或者默認值 --><slotv-else:name="item.prop":scope="scope.row":index="scope.$index"><span>{{ item.slot ? item.slot(scope.row) : scope.row[item.prop] }}</span></slot></template></el-table-column><el-table-column fixed="right" align="center" label="操作" width="200"><template v-slot="scope"><el-buttonv-for="(btn, index) in actionButtons":key="index":type="btn.type":size="btn.size"@click="btn.action(scope.row)">{{ btn.label }}</el-button></template></el-table-column></el-table>
?大致使用：
使用 /
/ 表格cloumntableColumn: [{ type: "index", label: "序號", fixed: "left" },{prop: "sourceName",label: "素材名稱",fixed: "left",},{label: "縮略圖",prop: "fileThumb",},{prop: "createTime",label: "創建時間",},{prop: "updateBy",label: "刪除人",},{prop: "updateTime",label: "刪除時間",},{prop: "sourceType",label: "素材格式",slot: (row) => {const stage = this.dict.type.resource_type;if (stage.length > 0) {const result = stage.find((item) => item.value == row.sourceType);return result?.label;}},},{prop: "sourceSubject",label: "專題分類",slot: (row) => {const stage = this.dict.type.resource_subject;if (stage.length > 0) {const result = stage.find((item) => item.value == row.sourceSubject);return result?.label;}},},{prop: "sourceGrade",label: "適用年級",slot: (row) => {const stage = this.dict.type.resource_garde;if (stage.length > 0) {const result = stage.find((item) => item.value == row.sourceGrade);return result?.label;}},},{prop: "sourcePlatform",label: "適用平臺",slot: (row) => {const stage = this.dict.type.resource_platform;if (stage.length > 0) {const result = stage.find((item) => item.value == row.sourcePlatform);return result?.label;}},},{prop: "sourceScene",label: "適用場景",slot: (row) => {const stage = this.dict.type.resource_scene;if (stage.length > 0) {const result = stage.find((item) => item.value == row.sourceScene);return result?.label;}},},{prop: "sourceLabel",label: "備注標簽",},],// 操作按鈕配置actionButtons: [{label: "恢復",type: "text",size: "small",action: this.recovery,},{label: "清除",type: "text",size: "small",action: this.eliminate,},],
)
