自定义弹窗时，在弹窗中获取表单的数据

[zuihou]

src/views/crud/form/custom-form/crud.tsx 代码：

import * as api from './api.js';
import { nextTick } from 'vue';
import {
  AddReq,
  CreateCrudOptionsProps,
  CreateCrudOptionsRet,
  CrudExpose,
  CrudOptions,
  DelReq,
  EditReq,
  useColumns,
  UserPageQuery,
  UserPageRes,
} from '@fast-crud/fast-crud';
import { useMessage } from 'naive-ui';
import { useFormWrapper } from '@fast-crud/fast-crud';

function useCustomFormWrapperDemo(crudExpose: CrudExpose) {
  let index = 0;
  const message = useMessage();
  // 自定义表单配置
  const { buildFormOptions } = useColumns();
  const validatePassword = async (_: any, value: string) => {
    const { getFormRef, getFormData } = crudExpose;
    if (value === '') {
      throw new Error('请输入信息');
    }
    await nextTick();
//  这里会报错
    console.log(await getFormData());
    if (getFormData().customField !== '') {
      const formRef = getFormRef().getFormRef();
      const validateFields = formRef.validateFields || formRef.validateField;
      if (validateFields) {
        validateFields(['customField']);
      }
    }
  };
  const customOptions: CrudOptions = {
    columns: {
      index: {
        title: 'index',
        type: 'number',
      },
      customField: {
        title: '新表单字段',
        type: 'text',
      },
      groupField: {
        title: '分组字段2',
        type: 'text',
        form: {
          rule: [
            { required: true, message: '请输入密码' },
            { validator: validatePassword, trigger: 'blur' }
          ],
        },
      },
    },
    form: {
      wrapper: {
        title: '自定义表单',
        buttons: {
          open: {
            text: '打开新对话框',
            order: -1,
            click() {
              openCustomForm();
            },
          },
        },
      },
      group: {
        groups: {
          testGroupName: {
            title: '分组测试',
            columns: ['groupField'],
          },
        },
      },
      doSubmit({ form }) {
        console.log('form submit:', form);
        message.info('自定义表单提交:' + JSON.stringify(form));
        message.warning('抛出异常可以阻止表单关闭');
        throw new Error('抛出异常可以阻止表单关闭');
      },
    },
  };

  const { openDialog } = useFormWrapper();
  //使用crudOptions结构来构建自定义表单配置
  //打开自定义表单
  const openCustomForm = async () => {
    const formOptions = buildFormOptions(customOptions);
    index++;
    formOptions.initialForm = { index };
    formOptions.newInstance = true; //新实例打开
    const dialogRef = await openDialog(formOptions);
    console.log('openCustomFormRef', dialogRef);
  };

  const openCustomFormByExpose = async () => {
    const formOptions = buildFormOptions(customOptions);
    index++;
    formOptions.initialForm = { index };
    formOptions.newInstance = true; //新实例打开
    const dialogRef = await crudExpose.openDialog(formOptions);
    console.log('openCustomFormByExposeRef', dialogRef);
  };

  return {
    openCustomForm,
    openCustomFormByExpose,
  };
}
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
  const { openCustomForm, openCustomFormByExpose } = useCustomFormWrapperDemo(crudExpose);
  const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
    return await api.GetList(query);
  };
  const editRequest = async ({ form, row }: EditReq) => {
    if (form.id == null) {
      form.id = row.id;
    }
    return await api.UpdateObj(form);
  };
  const delRequest = async ({ row }: DelReq) => {
    return await api.DelObj(row.id);
  };

  const addRequest = async ({ form }: AddReq) => {
    return await api.AddObj(form);
  };
  return {
    crudOptions: {
      actionbar: {
        buttons: {
          custom: {
            text: '打开自定义对话框',
            async click() {
              await openCustomForm();
            },
          },
          byExpose: {
            text: 'byExpose.openDialog',
            async click() {
              await openCustomFormByExpose();
            },
          },
        },
      },
      request: {
        pageRequest,
        addRequest,
        editRequest,
        delRequest,
      },
      columns: {
        title: {
          title: '商品标题',
          type: 'text',
        },
        code: {
          title: '商品代码',
          search: { show: true },
          type: 'text',
        },
      },
    },
  };
}

1. 我在这个页面中想要实现如下功能：

2. 表单校验 分组字段2 时， 判断“分组字段2”是否等于“新表单字段” ,但报错如下：

3. 代码：

4. 除了红框里面的代码是我自己写的， 其他代码基本都是github上最新的代码，没有改动。 将最上面的代码覆盖这个文件就能复现

[zuihou]

最新发现： 在新增按钮点开的弹窗中，可以 使用 getFormData() 方法获取到表单值。

在 openDialog 打开的弹窗中，无法获取

 const { getFormRef, getFormData } = crudExpose;
    if (value === '') {
      throw new Error('请输入信息');
    }
    await nextTick();
//  这里会报错
    console.log(await getFormData());

[zuihou]

请问这个问题有办法能解决或者绕过吗？

[greper]

dialogRef 下获取formRef 然后就可以获取到表单数据了