ApiSelect 组件写成方法形式 不生效

[yzh20021029]

版本号：

3.7.2

问题描述：

ApiSelect 组件componentProps写成方法形式 不生效，对象形式就可以生效

错误截图：

友情提示：

• 未按格式要求发帖、描述过于简单的，会被直接删掉;
• 描述问题请图文并茂，方便我们理解并快速定位问题;
• 如果使用的不是master，请说明你使用的分支;

[MuShan-bit]

文档里就是让传对象啊

[zhangdaiscott]

zy

[jeecgDeveloper]

对象形式是生效的，这个地方稍微有点特殊。

src/views/system/user/user.data.ts你定义的是函数，在src/views/system/user/UserDrawer.vue中的updateSchema调用时更新的是对象，导致在src/utils/index.ts中的deepMerge方法合并时后面的覆盖了前面的配置。在src/components/Form/src/components/ApiSelect.vue中的props中的labelField和valueField读取的是默认字段。数据中又没label和value字段，所以下拉显示的空白。

改法1：
在 src/views/system/user/UserDrawer.vue中componentProps加上初始的配置labelField: 'roleName' valueField: 'id'

  updateSchema([
      {
        field: 'password',
        // 【QQYUN-8324】
        ifShow: !unref(isUpdate),
      },
      {
        field: 'confirmPassword',
        ifShow: !unref(isUpdate),
      },
      {
        field: 'selectedroles',
        show: !data.isRole,
      },
      {
        field: 'departIds',
        componentProps: { options: departOptions },
      },
      {
        field: 'selecteddeparts',
        show: !data?.departDisabled,
      },
      {
        field: 'selectedroles',
        show: !data?.departDisabled,
        //update-begin---author:wangshuai ---date:20230424  for：【issues/4844】多租户模式下，新增或编辑用户，选择角色一栏，角色选项没有做租户隔离------------
        //判断是否为多租户模式
        componentProps:{
          api: data.tenantSaas?getAllRolesList:getAllRolesListNoByTenant,
          labelField: 'roleName',
         valueField: 'id',
        }
        //update-end---author:wangshuai ---date:20230424  for：【issues/4844】多租户模式下，新增或编辑用户，选择角色一栏，角色选项没有做租户隔离------------
      },
      //update-begin---author:wangshuai ---date:20230522  for：【issues/4935】租户用户编辑界面中租户下拉框未过滤，显示当前系统所有的租户------------
      {
        field: 'relTenantIds',
        componentProps:{
          disabled: !!data.tenantSaas,
        },
      },
      //update-end---author:wangshuai ---date:20230522  for：【issues/4935】租户用户编辑界面中租户下拉框未过滤，显示当前系统所有的租户------------
    ]);

改法2： （还需评估）
在src/utils/index.ts中修改 deepMerge 方法

export function deepMerge<T = any>(src: any = {}, target: any = {}): T {
  let key: string;
  for (key in target) {
    // update-begin--author:liaozhiyang---date:20240329---for：【QQYUN-7872】online表单label较长优化
    if (isObject(src[key]) && isObject(target[key])) {
      src[key] = deepMerge(src[key], target[key]);
    } else {
      if (isFunction(src[key]) && isObject(src[key]()) && isObject(target[key])) {
        // src[key]是函数且返回对象，且target[key]是对象
        src[key] = deepMerge(src[key](), target[key]);
      } else if (isObject(src[key]) && isFunction(target[key]) && isObject(target[key]())) {
        // target[key]是函数且返回对象，且src[key]是对象
        src[key] = deepMerge(src[key], target[key]());
      } else if (isFunction(src[key]) && isFunction(target[key]) && isObject(src[key]()) && isObject(target[key]())) {
        // src[key]是函数且返回对象，target[key]是函数且返回对象
        src[key] = deepMerge(src[key](), target[key]());
      } else {
        src[key] = target[key];
      }
    }
    // update-end--author:liaozhiyang---date:20240329---for：【QQYUN-7872】online表单label较长优化
  }
  return src;
}