fix: 无法打开的bug

packages/select-table-modal/index.vue

@@ -2,15 +2,15 @@
  * @Author: zhaojinfeng 121016171@qq.com
  * @Date: 2023-07-18 12:30:07
  * @LastEditors: zhaojinfeng 121016171@qq.com
- * @LastEditTime: 2023-07-21 21:39:13
+ * @LastEditTime: 2023-07-21 22:13:32
  * @FilePath: \vue3\packages\select-table-modal\index.vue
  * @Description: 模态框选择表格
  *
 -->
 <template>
-  <span @click="showDialog = true">
+  <span v-if="!hideButton" @click="open">
     <slot>
-      <el-button @click="showDialog = true">点击选择</el-button>
+      <el-button type="primary" plain>点击选择</el-button>
     </slot>
   </span>
   <el-config-provider :locale="locale">
@@ -84,7 +84,7 @@ const props = withDefaults(
     emptyText?: string
     value?: any
     rowKey?: string
-    show: boolean
+    show?: boolean
     columns: Partial<TableColumnCtx<any>>[]
     formItems: FormItem[]
     defaultParams?: Record<string, any>
@@ -123,14 +123,25 @@ interface FormItem {
     value: string
   }[]
 }
-const showDialog = useVModel(props, 'show')
+const showDialog = ref(false)
 
 let tableData = $ref<any[]>([])
 let selection = $ref<any>()
 function confirm() {
   emit('confirm', selection)
-  showDialog.value = false
+  if (props.hideButton)
+    emit('update:show', false)
+  else
+    showDialog.value = false
 }
+
+function open() {
+  if (props.hideButton)
+    emit('update:show', true)
+  else
+    showDialog.value = true
+}
+
 let total = $ref(0)
 
 function handleCurrentChange(val?: any) {
@@ -186,4 +197,9 @@ function closed() {
   queryParams.pageNum = 1
   selection = undefined
 }
+
+watch(() => props.show,
+  (show) => {
+    showDialog.value = show
+  })
 </script>

stories/SelectTableModal.stories.ts

@@ -2,7 +2,7 @@
  * @Author: zhaojinfeng 121016171@qq.com
  * @Date: 2023-07-18 12:30:07
  * @LastEditors: zhaojinfeng 121016171@qq.com
- * @LastEditTime: 2023-07-21 21:40:46
+ * @LastEditTime: 2023-07-21 22:03:59
  * @FilePath: \vue3\stories\SelectTableModal.stories.ts
  * @Description:
  *
@@ -30,7 +30,6 @@ const meta = {
   args: {
     value: '',
     rowKey: 'prop1',
-    show: false,
     columns: [{ label: 'label1', prop: 'prop1' }, { label: 'label2', prop: 'prop2' }, { label: 'label3', prop: 'prop3' }],
     formItems: [{ label: 'label1', prop: 'prop1' }, { label: 'label2', prop: 'prop2', selectOptions: [{ label: '1', value: '1' }, { label: '2', value: '2' }] }],
     defaultParams: {},
@@ -46,7 +45,7 @@ const meta = {
       return { args }
     },
     template: `<th-select-table-modal
-                 v-model:show="args.show"
+                 v-model:value="args.value"
                  :row-key="args.rowKey"
                  :columns="args.columns"
                  :form-items="args.formItems"