Ant Design Vue 4.0 a-modal弹窗组件封装

父组件（部分）

代码语言：javascript复制

  import SigningInfo from '@/components/Income/SigningInfo.vue';
  // DIalog弹窗状态
  const dialogPanelStatus = reactive<DialogPanelStatus>({
    signIngInfoStatus: false
  });
  // 数据重载
  const getMyWalletFn = ()=>{
    // 数据重载
  }
  // 关闭弹窗
  const closeDialog = (k: keyof DialogPanelStatus, rest: boolean) => {
    dialogPanelStatus[k] = false;
    rest && getMyWalletFn(true);
  };
  
  
  
  @import 'Income.less';

弹窗子组件

代码语言：javascript复制

import { toRefs } from 'vue';
import type { WalletData } from '@/types/index';
const props = withDefaults(
  defineProps<{
    visible: Boolean;
    walletData: WalletData;
  }>(),
  {}
);

const { visible, walletData } = toRefs(props);
  
// 关闭弹窗
const emits = defineEmits(['closeDialog']);
const closeDialogFn = (rest: boolean = false) => {
  emits('closeDialog', 'visibleStatus', rest);
};


@import 'SigningInfo.less';

ant boolean import rest 数据

0 人点赞