diff --git a/src/views/table/vxe-table/index.vue b/src/views/table/vxe-table/index.vue index c00b219..40d2c88 100644 --- a/src/views/table/vxe-table/index.vue +++ b/src/views/table/vxe-table/index.vue @@ -3,8 +3,8 @@ import { nextTick, reactive, ref } from "vue" import { type ElMessageBoxOptions, ElMessageBox, ElMessage } from "element-plus" import { deleteTableDataApi, getTableDataApi } from "@/api/table" import { type TableResponseData } from "@/api/table/types/table" -import RoleColumnSolts from "./tsx/RoleColumnSolts" -import StatusColumnSolts from "./tsx/StatusColumnSolts" +import RoleColumnSlots from "./tsx/RoleColumnSlots" +import StatusColumnSlots from "./tsx/StatusColumnSlots" import { type VxeGridInstance, type VxeGridProps, @@ -31,6 +31,7 @@ interface RowMeta { /** vxe-table 自动添加上去的属性 */ _VXE_ID?: string } + const xGridDom = ref() const xGridOpt: VxeGridProps = reactive({ loading: true, @@ -96,7 +97,7 @@ const xGridOpt: VxeGridProps = reactive({ field: "roles", title: "角色", /** 自定义列与 type: "html" 的列一起使用,会产生错误,所以采用 TSX 实现 */ - slots: RoleColumnSolts + slots: RoleColumnSlots }, { field: "phone", @@ -109,7 +110,7 @@ const xGridOpt: VxeGridProps = reactive({ { field: "status", title: "状态", - slots: StatusColumnSolts + slots: StatusColumnSlots }, { field: "createTime", diff --git a/src/views/table/vxe-table/tsx/RoleColumnSolts.tsx b/src/views/table/vxe-table/tsx/RoleColumnSlots.tsx similarity index 82% rename from src/views/table/vxe-table/tsx/RoleColumnSolts.tsx rename to src/views/table/vxe-table/tsx/RoleColumnSlots.tsx index 9d95f94..e34af98 100644 --- a/src/views/table/vxe-table/tsx/RoleColumnSolts.tsx +++ b/src/views/table/vxe-table/tsx/RoleColumnSlots.tsx @@ -1,6 +1,6 @@ import { type VxeColumnPropTypes } from "vxe-table/types/column" -const solts: VxeColumnPropTypes.Slots = { +const slots: VxeColumnPropTypes.Slots = { default: ({ row, column }) => { const cellValue = row[column.field] const type = cellValue === "admin" ? "primary" : "warning" @@ -8,4 +8,4 @@ const solts: VxeColumnPropTypes.Slots = { } } -export default solts +export default slots diff --git a/src/views/table/vxe-table/tsx/StatusColumnSolts.tsx b/src/views/table/vxe-table/tsx/StatusColumnSlots.tsx similarity index 83% rename from src/views/table/vxe-table/tsx/StatusColumnSolts.tsx rename to src/views/table/vxe-table/tsx/StatusColumnSlots.tsx index 125263c..3bf4d42 100644 --- a/src/views/table/vxe-table/tsx/StatusColumnSolts.tsx +++ b/src/views/table/vxe-table/tsx/StatusColumnSlots.tsx @@ -1,6 +1,6 @@ import { type VxeColumnPropTypes } from "vxe-table/types/column" -const solts: VxeColumnPropTypes.Slots = { +const slots: VxeColumnPropTypes.Slots = { default: ({ row, column }) => { const cellValue = row[column.field] const [type, value] = cellValue ? ["success", "启用"] : ["danger", "禁用"] @@ -8,4 +8,4 @@ const solts: VxeColumnPropTypes.Slots = { } } -export default solts +export default slots