fix(modal): ensure that props are passed correctly,fix #897

Vben
1 parent a1d956d3
Showing 5 changed files with 7 additions and 7 deletions
CHANGELOG.zh_CN.md
src/components/Modal/src/BasicModal.vue
src/views/demo/comp/modal/Modal1.vue
src/views/demo/comp/modal/Modal2.vue
src/views/demo/system/account/AccountDetail.vue
@@ -26,6 +26,7 @@
   - 修复菜单默认折叠的配置不起作用的问题
   - 修复`safari`浏览器报错导致网站打不开
   - 修复在 window 上，拉取代码后 eslint 因 endOfLine 而保错问题
+- **Modal** 确保 props 正确被传递
 ### 🎫 Chores
@@ -18,7 +18,7 @@
     </template>
     <template #footer v-if="!$slots.footer">
-      <ModalFooter v-bind="getProps" @ok="handleOk" @cancel="handleCancel">
+      <ModalFooter v-bind="getBindValue" @ok="handleOk" @cancel="handleCancel">
         <template #[item]="data" v-for="item in Object.keys($slots)">
           <slot :name="item" v-bind="data"></slot>
         </template>
@@ -82,7 +82,7 @@
     setup(props, { emit, attrs }) {
       const visibleRef = ref(false);
       const propsRef = ref<Partial<ModalProps> | null>(null);
-      const modalWrapperRef = ref<ComponentRef>(null);
+      const modalWrapperRef = ref<any>(null);
       // modal   Bottom and top height
       const extHeightRef = ref(0);
@@ -133,7 +133,7 @@
       });
       const getBindValue = computed((): Recordable => {
-        const attr = { ...attrs, ...unref(getProps) };
+        const attr = { ...attrs, ...unref(getMergeProps), visible: unref(visibleRef) };
         if (unref(fullScreenRef)) {
           return omit(attr, 'height');
         }
@@ -8,7 +8,7 @@
     @visible-change="handleShow"
   >
     <template #insertFooter>
-      <a-button type="danger" @click="setLines" :disabled="loading">点我更新内容</a-button>
+      <a-button type="primary" danger @click="setLines" :disabled="loading">点我更新内容</a-button>
     </template>
     <template v-if="loading">
       <div class="empty-tips"> 加载中，稍等3秒…… </div>
 <template>
   <BasicModal
-    v-bind="$attrs"
     @register="register"
     title="Modal Title"
     :helpMessage="['提示1', '提示2']"
+    :okButtonProps="{ disabled: true }"
   >
     <a-button type="primary" @click="closeModal" class="mr-2"> 从内部关闭弹窗 </a-button>
-
     <a-button type="primary" @click="setModalProps"> 从内部修改title </a-button>
   </BasicModal>
 </template>
@@ -6,7 +6,7 @@
     @back="goBack"
   >
     <template #extra>
-      <a-button type="danger"> 禁用账号 </a-button>
+      <a-button type="primary" danger> 禁用账号 </a-button>
       <a-button type="primary"> 修改密码 </a-button>
     </template>
     <template #footer>