diff --git a/package/component/package.json b/package/component/package.json
index 6d666891..c9123c04 100644
--- a/package/component/package.json
+++ b/package/component/package.json
@@ -1,6 +1,6 @@
{
"name": "@layui/layui-vue",
- "version": "1.3.12-alpha.4",
+ "version": "1.3.12-alpha.5",
"author": "就眠儀式",
"license": "MIT",
"description": "a component library for Vue 3 base on layui-vue",
diff --git a/package/component/src/component/checkbox/index.vue b/package/component/src/component/checkbox/index.vue
index 3d9c68ee..dd0b60d0 100644
--- a/package/component/src/component/checkbox/index.vue
+++ b/package/component/src/component/checkbox/index.vue
@@ -127,13 +127,7 @@ const isDisabled = computed(() => {
>{{ label }}
diff --git a/package/component/src/component/table/TableRow.vue b/package/component/src/component/table/TableRow.vue
index 8696f2af..41088cad 100644
--- a/package/component/src/component/table/TableRow.vue
+++ b/package/component/src/component/table/TableRow.vue
@@ -33,6 +33,7 @@ export interface LayTableRowProps {
data: any;
spanMethod: Function;
defaultExpandAll: boolean;
+ expandKeys: Recordable[];
}
const slot = useSlots();
@@ -40,6 +41,7 @@ const emit = defineEmits([
"row",
"row-double",
"row-contextmenu",
+ "update:expandKeys",
"update:selectedKeys",
"update:selectedKey",
]);
@@ -51,6 +53,17 @@ const props = withDefaults(defineProps(), {
cellClassName: "",
});
+const tableExpandAll = ref(props.defaultExpandAll);
+
+const tableExpandKeys: WritableComputedRef = computed({
+ get() {
+ return [...props.expandKeys];
+ },
+ set(val) {
+ emit("update:expandKeys", val);
+ },
+});
+
const tableSelectedKeys: WritableComputedRef = computed({
get() {
return [...props.selectedKeys];
@@ -69,7 +82,22 @@ const tableSelectedKey: WritableComputedRef = computed({
},
});
-const isExpand = ref(props.defaultExpandAll);
+const isExpand: WritableComputedRef = computed({
+ get() {
+ return tableExpandAll.value ? true : tableExpandKeys.value.includes(props.data[props.id]);
+ },
+ set(val) {
+ let newTableExpandKeys = [...tableExpandKeys.value]
+ if (!val) {
+ newTableExpandKeys.splice(newTableExpandKeys.indexOf(props.data[props.id]), 1);
+ } else {
+ newTableExpandKeys.push(props.data[props.id]);
+ }
+ tableExpandAll.value = false;
+ tableExpandKeys.value = newTableExpandKeys;
+ },
+});
+
const slotsData = ref([]);
props.columns.map((value: any) => {
@@ -535,6 +563,7 @@ const isAutoShow = (
@row="rowClick"
@row-double="rowDoubleClick"
@row-contextmenu="rowContextmenu"
+ v-model:expandKeys="tableExpandKeys"
v-model:selectedKeys="tableSelectedKeys"
v-model:selectedKey="tableSelectedKey"
>
diff --git a/package/component/src/component/table/index.vue b/package/component/src/component/table/index.vue
index a98249a0..b59e5530 100644
--- a/package/component/src/component/table/index.vue
+++ b/package/component/src/component/table/index.vue
@@ -47,6 +47,7 @@ export interface LayTableProps {
cellStyle?: string | Function;
spanMethod?: Function;
defaultExpandAll?: boolean;
+ expandKeys?: Recordable[];
}
const props = withDefaults(defineProps(), {
@@ -65,12 +66,14 @@ const props = withDefaults(defineProps(), {
cellStyle: "",
spanMethod: () => {},
defaultExpandAll: false,
+ expandKeys: () => []
});
const tableId = uuidv4();
const emit = defineEmits([
"change",
+ "update:expandKeys",
"update:selectedKeys",
"update:selectedKey",
"row-contextmenu",
@@ -112,6 +115,15 @@ const tableSelectedKey: WritableComputedRef = computed({
},
});
+const tableExpandKeys: WritableComputedRef = computed({
+ get() {
+ return [...props.expandKeys];
+ },
+ set(val) {
+ emit("update:expandKeys", val);
+ },
+});
+
watch(
() => props.dataSource,
() => {
@@ -584,10 +596,11 @@ const renderTotalRowCell = (column: any) => {
:rowStyle="rowStyle"
:rowClassName="rowClassName"
:spanMethod="spanMethod"
- :defaultExpandAll="defaultExpandAll"
+ :defaultExpandAll="defaultExpandAll"
@row="rowClick"
@row-double="rowDoubleClick"
@row-contextmenu="rowContextmenu"
+ v-model:expandKeys="tableExpandKeys"
v-model:selectedKeys="tableSelectedKeys"
v-model:selectedKey="tableSelectedKey"
>
diff --git a/package/document-component/src/document/zh-CN/components/table.md b/package/document-component/src/document/zh-CN/components/table.md
index e986d6a3..a1a2209d 100644
--- a/package/document-component/src/document/zh-CN/components/table.md
+++ b/package/document-component/src/document/zh-CN/components/table.md
@@ -226,7 +226,8 @@ export default {
::: demo 当表格内容较多不能一次性完全展示时。
-
+ 展开行: {{ expandKeys6 }}
+
@@ -252,17 +253,22 @@ export default {
]
const dataSource6 = [
- {name:"张三", score:100},
- {name:"李四", score:80},
- {name:"王二", score:99},
- {name:"麻子", score:92},
- {name:"无名", score:60},
- {name:"有名", score:70},
+ {id:"1", name:"张三", score:100},
+ {id:"2", name:"李四", score:80},
+ {id:"3", name:"王二", score:99},
+ {id:"4", name:"麻子", score:92},
+ {id:"5", name:"无名", score:60},
+ {id:"6", name:"有名", score:70},
]
+ const expandKeys6 = ref(["1"])
+ const defaultExpandAll6 = ref(false)
+
return {
columns6,
- dataSource6
+ dataSource6,
+ expandKeys6,
+ defaultExpandAll6
}
}
}