@aspire-ui/element-component-pro 1.0.14 → 1.0.16

package/dist/index.d.ts

@@ -1700,6 +1700,7 @@ declare const _default: {
             type: import('vue').PropType<import('./types').FormListeners>;
         };
     }>>> & import('vue').ShallowUnwrapRef<{
+        registerFieldInstance: (field: string, instance: Record<string, unknown> | null) => void;
         getFieldsValue: () => Record<string, unknown>;
         setFieldsValue: (values: Record<string, unknown>) => Promise<void>;
         resetFields: () => Promise<void>;
@@ -1712,6 +1713,9 @@ declare const _default: {
         appendSchemaByField: (schema: import('./types').ProFormSchema, prefixField?: string, first?: boolean) => Promise<void>;
         removeSchemaByField: (field: string | string[]) => Promise<void>;
         setProps: (props: Partial<import('./types').ProFormProps>) => Promise<void>;
+        getComponentInstance: (field: string) => import('vue').ComponentPublicInstance | null;
+        getFieldOptions: import('./types').GetFieldOptions;
+        isFieldLoading: (field: string) => boolean;
     }> & import('vue/types/v3-component-options').ExtractComputedReturns<{}> & import('vue').ComponentCustomProperties & Readonly<import('vue').ExtractPropTypes<{
         disabled: {
             type: import('vue').PropType<boolean>;
@@ -1945,6 +1949,7 @@ declare const _default: {
             type: import('vue').PropType<import('./types').FormListeners>;
         };
     }>>, {
+        registerFieldInstance: (field: string, instance: Record<string, unknown> | null) => void;
         getFieldsValue: () => Record<string, unknown>;
         setFieldsValue: (values: Record<string, unknown>) => Promise<void>;
         resetFields: () => Promise<void>;
@@ -1957,6 +1962,9 @@ declare const _default: {
         appendSchemaByField: (schema: import('./types').ProFormSchema, prefixField?: string, first?: boolean) => Promise<void>;
         removeSchemaByField: (field: string | string[]) => Promise<void>;
         setProps: (props: Partial<import('./types').ProFormProps>) => Promise<void>;
+        getComponentInstance: (field: string) => import('vue').ComponentPublicInstance | null;
+        getFieldOptions: import('./types').GetFieldOptions;
+        isFieldLoading: (field: string) => boolean;
     }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
         submit: (values: Record<string, unknown>) => void;
         reset: () => void;

package/dist/style.css

@@ -1 +1 @@
-.ecp-pro-table[data-v-f3d27813]{padding:16px;background:#fff;width:100%;box-sizing:border-box}.ecp-pro-table[data-v-f3d27813] .el-table{width:100%!important}.ecp-pro-table__header[data-v-f3d27813]{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.ecp-pro-table__title-wrapper[data-v-f3d27813]{display:flex;align-items:center;gap:4px}.ecp-pro-table__title[data-v-f3d27813]{font-size:16px;font-weight:600}.ecp-pro-table__help[data-v-f3d27813]{color:#909399;cursor:help}.ecp-pro-table__toolbar[data-v-f3d27813]{display:flex;align-items:center;gap:8px}.ecp-pro-table__body[data-v-f3d27813]{width:100%}.ecp-pro-table__pagination[data-v-f3d27813]{margin-top:16px;display:flex;justify-content:flex-end}.ecp-pro-table__col-help[data-v-f3d27813]{margin-left:4px;color:#909399;cursor:help}.ecp-table-action[data-v-45a58e7c],.ecp-table-action__item[data-v-45a58e7c]{display:inline-flex;align-items:center;gap:4px}.ecp-table-action__icon[data-v-45a58e7c]{margin-right:4px}.ecp-table-action__more[data-v-45a58e7c]{display:inline-flex;align-items:center}.ecp-table-action__dropdown-item[data-v-45a58e7c]{display:inline-flex;align-items:center;gap:4px}.ecp-tree-select[data-v-f30bba11]{position:relative;width:100%}.ecp-tree-select__filter-inner[data-v-f30bba11]{margin-bottom:8px}.ecp-tree-select__dropdown[data-v-f30bba11]{position:absolute;top:100%;left:0;right:0;max-height:280px;overflow:auto;background:#fff;border:1px solid #dcdfe6;border-radius:4px;margin-top:4px;z-index:1000;padding:8px}.ecp-tree-select__loading[data-v-f30bba11]{padding:24px;text-align:center;color:#909399;font-size:14px}.ecp-pro-form-item__colon[data-v-d3466c67]{margin-right:2px}.ecp-pro-form-item__help-icon[data-v-d3466c67]{margin-left:4px;color:#909399;cursor:help;font-size:14px}.ecp-pro-form-item__help-icon[data-v-d3466c67]:hover{color:#409eff}.ecp-pro-form-item__help-item[data-v-d3466c67]{margin-bottom:4px}.ecp-pro-form-item__help-item[data-v-d3466c67]:last-child{margin-bottom:0}.ecp-form-actions[data-v-489c88d2]{text-align:right}.ecp-form-actions__advance[data-v-489c88d2]{margin-right:8px}.el-icon-d-arrow-left.up[data-v-489c88d2]{transform:rotate(90deg)}.el-icon-d-arrow-left.down[data-v-489c88d2]{transform:rotate(-90deg)}.ecp-pro-form[data-v-bf70afca]{padding:16px;position:relative}.ecp-pro-form__advance[data-v-bf70afca]{margin-bottom:16px}.ecp-pro-form_col[data-v-bf70afca]{position:relative;float:right}.el-icon-d-arrow-left.up[data-v-bf70afca]{transform:rotate(90deg)}.el-icon-d-arrow-left.down[data-v-bf70afca]{transform:rotate(-90deg)}.ecp-form-actions__advance[data-v-bf70afca]{position:absolute;bottom:0;left:50%;transform:translate(-50%,-50%)}.ecp-pro-descriptions[data-v-656036f6]{width:100%;box-sizing:border-box}.ecp-pro-descriptions__header[data-v-656036f6]{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:12px}.ecp-pro-descriptions__title-wrap[data-v-656036f6]{display:flex;align-items:center;gap:6px}.ecp-pro-descriptions__title[data-v-656036f6]{font-size:16px;font-weight:600;color:#303133}.ecp-pro-descriptions__help[data-v-656036f6],.ecp-pro-descriptions__toggle[data-v-656036f6]{color:#909399}.ecp-pro-descriptions__toggle .el-icon-arrow-down[data-v-656036f6]{margin-left:4px;transition:transform .2s ease}.ecp-pro-descriptions__toggle .el-icon-arrow-down.is-expanded[data-v-656036f6]{transform:rotate(180deg)}.ecp-pro-descriptions__body[data-v-656036f6]{display:grid;border-top:1px solid #ebeef5;border-left:1px solid #ebeef5;overflow:hidden}.ecp-pro-descriptions__body.is-collapsed[data-v-656036f6]{overflow:hidden}.ecp-pro-descriptions__body[data-v-656036f6]:not(.is-bordered){border-top:0;border-left:0;gap:12px 16px}.ecp-pro-descriptions__item[data-v-656036f6]{display:flex;min-width:0;border-right:1px solid #ebeef5;border-bottom:1px solid #ebeef5}.ecp-pro-descriptions__body:not(.is-bordered) .ecp-pro-descriptions__item[data-v-656036f6]{border-right:0;border-bottom:0}.ecp-pro-descriptions__label[data-v-656036f6],.ecp-pro-descriptions__content[data-v-656036f6]{min-width:0;box-sizing:border-box;word-break:break-word}.ecp-pro-descriptions__label[data-v-656036f6]{flex:0 0 120px;padding:12px 16px;color:#606266;background:#fafafa}.ecp-pro-descriptions__content[data-v-656036f6]{flex:1;padding:12px 16px;color:#303133;background:#fff}.ecp-pro-descriptions__body:not(.is-bordered) .ecp-pro-descriptions__label[data-v-656036f6]{flex-basis:auto;padding:0;margin-right:8px;background:transparent;font-weight:500}.ecp-pro-descriptions__body:not(.is-bordered) .ecp-pro-descriptions__content[data-v-656036f6]{padding:0;background:transparent}.ecp-pro-descriptions__body.is-small .ecp-pro-descriptions__label[data-v-656036f6],.ecp-pro-descriptions__body.is-small .ecp-pro-descriptions__content[data-v-656036f6]{padding-top:8px;padding-bottom:8px;font-size:13px}@media (max-width: 767px){.ecp-pro-descriptions__item[data-v-656036f6]{flex-direction:column}.ecp-pro-descriptions__label[data-v-656036f6]{flex-basis:auto}}.ecp-pro-table-form__form[data-v-44aa7592] .el-form-item{margin-bottom:0}.ecp-pro-table-form__cell-item[data-v-44aa7592]{width:100%}.ecp-pro-table-form__cell-item[data-v-44aa7592] .el-form-item__content{margin-left:0!important;line-height:normal}.ecp-pro-table-form__fixed-label[data-v-44aa7592]{color:#303133;font-size:14px}.ecp-pro-table-form__req[data-v-44aa7592]{color:#f56c6c;margin-right:2px}.ecp-pro-table-form__th-text[data-v-44aa7592]{font-weight:500;color:#606266}.ecp-pro-table-form__action-title[data-v-44aa7592]{margin-right:8px;font-size:13px;color:#606266}.ecp-pro-table-form__add-btn[data-v-44aa7592]{padding:0;font-size:14px}.ecp-pro-table-form__del-btn[data-v-44aa7592]{padding:0;color:#909399}.ecp-pro-table-form__del-btn[data-v-44aa7592]:not(:disabled){color:#409eff}.ecp-pro-table-form .ecp-pro-table-form__header-cell{background:#f5f7fa!important}
+.ecp-pro-table[data-v-f3d27813]{padding:16px;background:#fff;width:100%;box-sizing:border-box}.ecp-pro-table[data-v-f3d27813] .el-table{width:100%!important}.ecp-pro-table__header[data-v-f3d27813]{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.ecp-pro-table__title-wrapper[data-v-f3d27813]{display:flex;align-items:center;gap:4px}.ecp-pro-table__title[data-v-f3d27813]{font-size:16px;font-weight:600}.ecp-pro-table__help[data-v-f3d27813]{color:#909399;cursor:help}.ecp-pro-table__toolbar[data-v-f3d27813]{display:flex;align-items:center;gap:8px}.ecp-pro-table__body[data-v-f3d27813]{width:100%}.ecp-pro-table__pagination[data-v-f3d27813]{margin-top:16px;display:flex;justify-content:flex-end}.ecp-pro-table__col-help[data-v-f3d27813]{margin-left:4px;color:#909399;cursor:help}.ecp-table-action[data-v-45a58e7c],.ecp-table-action__item[data-v-45a58e7c]{display:inline-flex;align-items:center;gap:4px}.ecp-table-action__icon[data-v-45a58e7c]{margin-right:4px}.ecp-table-action__more[data-v-45a58e7c]{display:inline-flex;align-items:center}.ecp-table-action__dropdown-item[data-v-45a58e7c]{display:inline-flex;align-items:center;gap:4px}.ecp-tree-select[data-v-f30bba11]{position:relative;width:100%}.ecp-tree-select__filter-inner[data-v-f30bba11]{margin-bottom:8px}.ecp-tree-select__dropdown[data-v-f30bba11]{position:absolute;top:100%;left:0;right:0;max-height:280px;overflow:auto;background:#fff;border:1px solid #dcdfe6;border-radius:4px;margin-top:4px;z-index:1000;padding:8px}.ecp-tree-select__loading[data-v-f30bba11]{padding:24px;text-align:center;color:#909399;font-size:14px}.ecp-pro-form-item__colon[data-v-48d7960b]{margin-right:2px}.ecp-pro-form-item__help-icon[data-v-48d7960b]{margin-left:4px;color:#909399;cursor:help;font-size:14px}.ecp-pro-form-item__help-icon[data-v-48d7960b]:hover{color:#409eff}.ecp-pro-form-item__help-item[data-v-48d7960b]{margin-bottom:4px}.ecp-pro-form-item__help-item[data-v-48d7960b]:last-child{margin-bottom:0}.ecp-form-actions[data-v-489c88d2]{text-align:right}.ecp-form-actions__advance[data-v-489c88d2]{margin-right:8px}.el-icon-d-arrow-left.up[data-v-489c88d2]{transform:rotate(90deg)}.el-icon-d-arrow-left.down[data-v-489c88d2]{transform:rotate(-90deg)}.ecp-pro-form[data-v-80bac8be]{padding:16px;position:relative}.ecp-pro-form__advance[data-v-80bac8be]{margin-bottom:16px}.ecp-pro-form_col[data-v-80bac8be]{position:relative;float:right}.el-icon-d-arrow-left.up[data-v-80bac8be]{transform:rotate(90deg)}.el-icon-d-arrow-left.down[data-v-80bac8be]{transform:rotate(-90deg)}.ecp-form-actions__advance[data-v-80bac8be]{position:absolute;bottom:0;left:50%;transform:translate(-50%,-50%)}.ecp-pro-descriptions[data-v-656036f6]{width:100%;box-sizing:border-box}.ecp-pro-descriptions__header[data-v-656036f6]{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:12px}.ecp-pro-descriptions__title-wrap[data-v-656036f6]{display:flex;align-items:center;gap:6px}.ecp-pro-descriptions__title[data-v-656036f6]{font-size:16px;font-weight:600;color:#303133}.ecp-pro-descriptions__help[data-v-656036f6],.ecp-pro-descriptions__toggle[data-v-656036f6]{color:#909399}.ecp-pro-descriptions__toggle .el-icon-arrow-down[data-v-656036f6]{margin-left:4px;transition:transform .2s ease}.ecp-pro-descriptions__toggle .el-icon-arrow-down.is-expanded[data-v-656036f6]{transform:rotate(180deg)}.ecp-pro-descriptions__body[data-v-656036f6]{display:grid;border-top:1px solid #ebeef5;border-left:1px solid #ebeef5;overflow:hidden}.ecp-pro-descriptions__body.is-collapsed[data-v-656036f6]{overflow:hidden}.ecp-pro-descriptions__body[data-v-656036f6]:not(.is-bordered){border-top:0;border-left:0;gap:12px 16px}.ecp-pro-descriptions__item[data-v-656036f6]{display:flex;min-width:0;border-right:1px solid #ebeef5;border-bottom:1px solid #ebeef5}.ecp-pro-descriptions__body:not(.is-bordered) .ecp-pro-descriptions__item[data-v-656036f6]{border-right:0;border-bottom:0}.ecp-pro-descriptions__label[data-v-656036f6],.ecp-pro-descriptions__content[data-v-656036f6]{min-width:0;box-sizing:border-box;word-break:break-word}.ecp-pro-descriptions__label[data-v-656036f6]{flex:0 0 120px;padding:12px 16px;color:#606266;background:#fafafa}.ecp-pro-descriptions__content[data-v-656036f6]{flex:1;padding:12px 16px;color:#303133;background:#fff}.ecp-pro-descriptions__body:not(.is-bordered) .ecp-pro-descriptions__label[data-v-656036f6]{flex-basis:auto;padding:0;margin-right:8px;background:transparent;font-weight:500}.ecp-pro-descriptions__body:not(.is-bordered) .ecp-pro-descriptions__content[data-v-656036f6]{padding:0;background:transparent}.ecp-pro-descriptions__body.is-small .ecp-pro-descriptions__label[data-v-656036f6],.ecp-pro-descriptions__body.is-small .ecp-pro-descriptions__content[data-v-656036f6]{padding-top:8px;padding-bottom:8px;font-size:13px}@media (max-width: 767px){.ecp-pro-descriptions__item[data-v-656036f6]{flex-direction:column}.ecp-pro-descriptions__label[data-v-656036f6]{flex-basis:auto}}.ecp-pro-table-form__form[data-v-44aa7592] .el-form-item{margin-bottom:0}.ecp-pro-table-form__cell-item[data-v-44aa7592]{width:100%}.ecp-pro-table-form__cell-item[data-v-44aa7592] .el-form-item__content{margin-left:0!important;line-height:normal}.ecp-pro-table-form__fixed-label[data-v-44aa7592]{color:#303133;font-size:14px}.ecp-pro-table-form__req[data-v-44aa7592]{color:#f56c6c;margin-right:2px}.ecp-pro-table-form__th-text[data-v-44aa7592]{font-weight:500;color:#606266}.ecp-pro-table-form__action-title[data-v-44aa7592]{margin-right:8px;font-size:13px;color:#606266}.ecp-pro-table-form__add-btn[data-v-44aa7592]{padding:0;font-size:14px}.ecp-pro-table-form__del-btn[data-v-44aa7592]{padding:0;color:#909399}.ecp-pro-table-form__del-btn[data-v-44aa7592]:not(:disabled){color:#409eff}.ecp-pro-table-form .ecp-pro-table-form__header-cell{background:#f5f7fa!important}

package/dist/types/index.d.ts

@@ -1,4 +1,4 @@
-import { VNode } from 'vue';
+import { VNode, ComponentPublicInstance } from 'vue';
 
 /** 栅格配置 */
 export interface ColEx {
@@ -28,6 +28,22 @@ export interface ScrollToFieldOptions {
     /** 行内对齐 */
     inline?: ScrollLogicalPosition;
 }
+export interface ProFormFieldOption {
+    label: string;
+    value: unknown;
+}
+export interface GetFieldOptions {
+    (field: string): ProFormFieldOption[];
+    (field: string, raw: false): ProFormFieldOption[];
+    (field: string, raw: true): unknown[];
+}
+/** ApiSelect 暴露的实例类型 */
+export interface ApiSelectInstance {
+    options: ProFormFieldOption[];
+    rawOptions: unknown[];
+    loading: boolean;
+    fetchOptions: () => Promise<void>;
+}
 /** 表单操作类型（参考 Vben Admin FormActionType） */
 export interface FormActionType {
     getFieldsValue: () => Record<string, unknown>;
@@ -42,6 +58,12 @@ export interface FormActionType {
     appendSchemaByField: (schema: ProFormSchema, prefixField?: string, first?: boolean) => Promise<void>;
     removeSchemaByField: (field: string | string[]) => Promise<void>;
     setProps: (props: Partial<ProFormProps>) => Promise<void>;
+    /** 获取指定字段的组件实例 */
+    getComponentInstance: (field: string) => ComponentPublicInstance | null;
+    /** 获取 api-select 字段的 options，raw=true 时返回接口原始列表数据 */
+    getFieldOptions: GetFieldOptions;
+    /** 获取 api-select 字段的加载状态 */
+    isFieldLoading: (field: string) => boolean;
 }
 /** 时间字段映射 [表单字段, [开始字段, 结束字段], 格式?] */
 export type FieldMapToTime = [string, [string, string], string?];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aspire-ui/element-component-pro",
-  "version": "1.0.14",
+  "version": "1.0.16",
   "description": "Element UI 二次封装组件库，基于 Vue 2.7 + TypeScript + setup 语法糖，实现 VbenAdmin 风格的 Pro 组件",
   "type": "module",
   "main": "./dist/element-component-pro.umd.js",

package/src/ProForm/ApiSelect.vue

@@ -1,7 +1,6 @@
 <template>
-  <el-select :value="value" :placeholder="placeholder" :disabled="disabled" :loading="loading" :clearable="clearable"
-    :filterable="filterable" :multiple="multiple" v-bind="$attrs" @input="$emit('input', $event)"
-    @visible-change="onVisibleChange">
+  <el-select v-bind="{ ...$attrs, value: value, placeholder, disabled, loading, clearable, filterable, multiple }"
+    @input="$emit('input', $event)" @change="$emit('change', $event)" @visible-change="onVisibleChange">
     <el-option v-for="opt in options" :key="String(opt.value)" :label="opt.label" :value="opt.value" />
   </el-select>
 </template>
@@ -31,13 +30,20 @@ const props = withDefaults(
   { labelField: 'label', valueField: 'value', lazy: false }
 )
 
-defineEmits<{ (e: 'input', value: unknown): void }>()
+defineEmits<{ (e: 'input', value: unknown): void; (e: 'change', value: unknown): void }>()
 
 const loading = ref(false)
 const options = ref<Array<{ label: string; value: unknown }>>([])
+const rawOptions = ref<unknown[]>([])
+const cachedParams = ref<string>('')
 
 const onVisibleChange = (visible: boolean) => {
-  if (props.lazy && visible) fetchOptions()
+  if (props.lazy && visible) {
+    const paramsKey = JSON.stringify(props.params ?? {})
+    if (paramsKey !== cachedParams.value || options.value.length === 0) {
+      fetchOptions()
+    }
+  }
 }
 
 const fetchOptions = async () => {
@@ -50,6 +56,7 @@ const fetchOptions = async () => {
       : ((res as Record<string, unknown>)?.list as unknown[]) ??
       ((res as Record<string, unknown>)?.data as unknown[]) ??
       []
+    rawOptions.value = raw
     const labelKey = props.labelField ?? 'label'
     const valueKey = props.valueField ?? 'value'
     options.value = raw.map((item: unknown) => {
@@ -59,11 +66,19 @@ const fetchOptions = async () => {
         value: o[valueKey] ?? o.value,
       }
     })
+    cachedParams.value = JSON.stringify(props.params ?? {})
   } finally {
     loading.value = false
   }
 }
 
+defineExpose({
+  options,
+  rawOptions,
+  loading,
+  fetchOptions,
+})
+
 onMounted(() => {
   if (!props.lazy) fetchOptions()
 })
@@ -72,12 +87,14 @@ watch(() => props.api, () => {
     fetchOptions()
   } else {
     options.value = []
+    rawOptions.value = []
   }
 }, { deep: true }
 )
 watch(() => props.params, () => {
   if (props.lazy) {
     options.value = []
+    rawOptions.value = []
   } else {
     fetchOptions()
   }

package/src/ProForm/ProForm.vue

@@ -10,7 +10,8 @@
             :offset="schema.colProps?.offset ?? effectiveProps.baseColProps?.offset ?? 0" :data-field="schema.field">
             <ProFormItem :schema="schema" :form-model="currentFormModel" :form-disabled="effectiveProps.disabled"
               :auto-placeholder="effectiveProps.autoSetPlaceholder" :form-action-type="formActionRef" :colon="effectiveProps.colon"
-              :custom-components="formCustomComponents" :on-field-change="handleFieldChange">
+              :custom-components="formCustomComponents" :on-field-change="handleFieldChange"
+              :register-field-instance="registerFieldInstance">
               <template v-if="slots[getSlotName(schema)]">
                 <slot :name="getSlotName(schema)" :model="currentFormModel" :schema="schema" :field="schema.field"
                   :values="currentFormModel" />
@@ -57,10 +58,11 @@
 
 <script setup lang="ts">
 import { ref, computed, watch, useSlots, onMounted, onUnmounted } from 'vue'
+import type { ComponentPublicInstance } from 'vue'
 import { useComponentSetting } from '../useComponentSetting'
 import ProFormItem from './ProFormItem.vue'
 import FormActions from './FormActions.vue'
-import type { ProFormSchema, ProFormProps, FormActionType, ColEx, ScrollToFieldOptions, FormListeners } from '../types'
+import type { ProFormSchema, ProFormProps, FormActionType, ColEx, ScrollToFieldOptions, FormListeners, ApiSelectInstance } from '../types'
 
 const props = withDefaults(
   defineProps<{
@@ -103,7 +105,7 @@ const props = withDefaults(
     autoSetPlaceholder: true,
     showSubmitButton: true,
     showResetButton: true,
-    submitButtonText: '提交',
+    submitButtonText: '查询',
     resetButtonText: '重置',
     submitButtonIcon: 'el-icon-search',
     resetButtonIcon: 'el-icon-refresh-left',
@@ -132,6 +134,8 @@ const formModel = ref<Record<string, unknown>>({})
 const formRules = ref<Record<string, unknown[]>>({})
 const innerSchemas = ref<ProFormSchema[]>([])
 const innerProps = ref<Partial<ProFormProps>>({})
+/** 字段名 -> 组件实例映射（用于获取 api-select 等组件的内部状态） */
+const fieldInstanceMap = ref<Map<string, ComponentPublicInstance>>(new Map())
 
 /** Element UI 栅格断点 (px) */
 const BREAKPOINTS = { xl: 1920, lg: 1200, md: 992, sm: 768 }
@@ -404,6 +408,42 @@ const setProps = async (formProps: Partial<ProFormProps>) => {
   }
 }
 
+/** 注册组件实例（供 ProFormItem 调用） */
+const registerFieldInstance = (field: string, instance: Record<string, unknown> | null) => {
+  if (instance) {
+    fieldInstanceMap.value.set(field, instance as unknown as ComponentPublicInstance)
+  } else {
+    fieldInstanceMap.value.delete(field)
+  }
+}
+
+/** 获取指定字段的组件实例 */
+const getComponentInstance = (field: string): ComponentPublicInstance | null => {
+  return fieldInstanceMap.value.get(field) ?? null
+}
+
+/** 获取 api-select 字段的 options，raw=true 时返回接口原始数据 */
+function getFieldOptions(field: string): Array<{ label: string; value: unknown }>
+function getFieldOptions(field: string, raw: false): Array<{ label: string; value: unknown }>
+function getFieldOptions(field: string, raw: true): unknown[]
+function getFieldOptions(field: string, raw = false): Array<{ label: string; value: unknown }> | unknown[] {
+  const instance = fieldInstanceMap.value.get(field)
+  if (!instance) return []
+  const apiSelectInstance = instance as unknown as ApiSelectInstance
+  if (raw) {
+    return apiSelectInstance?.rawOptions ?? []
+  }
+  return apiSelectInstance?.options ?? []
+}
+
+/** 获取 api-select 字段的加载状态 */
+const isFieldLoading = (field: string): boolean => {
+  const instance = fieldInstanceMap.value.get(field)
+  if (!instance) return false
+  const apiSelectInstance = instance as unknown as ApiSelectInstance
+  return apiSelectInstance?.loading ?? false
+}
+
 const formActionRef: FormActionType = {
   getFieldsValue,
   setFieldsValue,
@@ -417,9 +457,15 @@ const formActionRef: FormActionType = {
   appendSchemaByField,
   removeSchemaByField,
   setProps,
+  getComponentInstance,
+  getFieldOptions,
+  isFieldLoading,
 }
 
-defineExpose(formActionRef)
+defineExpose({
+  ...formActionRef,
+  registerFieldInstance,
+})
 
 const syncSchemas = () => {
   innerSchemas.value = [...(props.schemas ?? [])]

package/src/ProForm/ProFormItem.vue

@@ -91,6 +91,7 @@
         </el-select>
         <ApiSelect
           v-else-if="schema.component === 'api-select'"
+          ref="apiSelectRef"
           :value="formModel[schema.field]"
           :placeholder="schema.placeholder || (autoPlaceholder ? `请选择${schema.label}` : undefined)"
           :disabled="effectiveDisabled"
@@ -178,7 +179,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, useSlots, h } from 'vue'
+import { computed, useSlots, h, ref, onMounted, onUnmounted } from 'vue'
 import ApiSelect from './ApiSelect.vue'
 import FormattedNumberInput from './FormattedNumberInput.vue'
 import TreeSelect from './TreeSelect.vue'
@@ -201,8 +202,25 @@ const props = defineProps<{
   onFieldChange?: (field: string, value: unknown) => void
   /** 自定义组件映射（由 ProForm 传入） */
   customComponents?: Record<string, unknown>
+  /** 注册字段实例（由 ProForm 传入） */
+  registerFieldInstance?: (field: string, instance: Record<string, unknown> | null) => void
 }>()
 
+/** ApiSelect 组件实例 ref */
+const apiSelectRef = ref<Record<string, unknown> | null>(null)
+
+onMounted(() => {
+  if (props.schema.component === 'api-select') {
+    props.registerFieldInstance?.(props.schema.field, apiSelectRef.value)
+  }
+})
+
+onUnmounted(() => {
+  if (props.schema.component === 'api-select') {
+    props.registerFieldInstance?.(props.schema.field, null)
+  }
+})
+
 const slots = useSlots()
 
 const renderParams = computed<RenderCallbackParams>(() => ({

package/src/ProForm/useForm.ts

@@ -24,6 +24,9 @@ export interface UseFormReturn {
   appendSchemaByField: (schema: ProFormSchema, prefixField?: string, first?: boolean) => Promise<void>
   removeSchemaByField: (field: string | string[]) => Promise<void>
   setProps: (props: Partial<ProFormProps>) => Promise<void>
+  getComponentInstance: FormActionType['getComponentInstance']
+  getFieldOptions: FormActionType['getFieldOptions']
+  isFieldLoading: FormActionType['isFieldLoading']
 }
 
 export function useForm(props?: UseFormPropsReactive): [UseFormReturn['register'], Omit<UseFormReturn, 'register'>] {
@@ -92,6 +95,21 @@ export function useForm(props?: UseFormPropsReactive): [UseFormReturn['register'
     await formAction.value?.setProps(formProps)
   }
 
+  const getComponentInstance: FormActionType['getComponentInstance'] = (field) =>
+    formAction.value?.getComponentInstance(field) ?? null
+
+  function getFieldOptions(field: string): Array<{ label: string; value: unknown }>
+  function getFieldOptions(field: string, raw: false): Array<{ label: string; value: unknown }>
+  function getFieldOptions(field: string, raw: true): unknown[]
+  function getFieldOptions(field: string, raw = false): Array<{ label: string; value: unknown }> | unknown[] {
+    if (!formAction.value) return []
+    if (raw) return formAction.value.getFieldOptions(field, true)
+    return formAction.value.getFieldOptions(field)
+  }
+
+  const isFieldLoading: FormActionType['isFieldLoading'] = (field) =>
+    formAction.value?.isFieldLoading(field) ?? false
+
   const result: UseFormReturn = {
     register,
     formAction,
@@ -107,6 +125,9 @@ export function useForm(props?: UseFormPropsReactive): [UseFormReturn['register'
     appendSchemaByField,
     removeSchemaByField,
     setProps,
+    getComponentInstance,
+    getFieldOptions,
+    isFieldLoading,
   }
 
   return [register, result]

package/src/types/index.ts

@@ -1,4 +1,5 @@
 import type { VNode } from 'vue'
+import type { ComponentPublicInstance } from 'vue'
 
 /** 栅格配置 */
 export interface ColEx {
@@ -31,6 +32,25 @@ export interface ScrollToFieldOptions {
   inline?: ScrollLogicalPosition
 }
 
+export interface ProFormFieldOption {
+  label: string
+  value: unknown
+}
+
+export interface GetFieldOptions {
+  (field: string): ProFormFieldOption[]
+  (field: string, raw: false): ProFormFieldOption[]
+  (field: string, raw: true): unknown[]
+}
+
+/** ApiSelect 暴露的实例类型 */
+export interface ApiSelectInstance {
+  options: ProFormFieldOption[]
+  rawOptions: unknown[]
+  loading: boolean
+  fetchOptions: () => Promise<void>
+}
+
 /** 表单操作类型（参考 Vben Admin FormActionType） */
 export interface FormActionType {
   getFieldsValue: () => Record<string, unknown>
@@ -45,6 +65,12 @@ export interface FormActionType {
   appendSchemaByField: (schema: ProFormSchema, prefixField?: string, first?: boolean) => Promise<void>
   removeSchemaByField: (field: string | string[]) => Promise<void>
   setProps: (props: Partial<ProFormProps>) => Promise<void>
+  /** 获取指定字段的组件实例 */
+  getComponentInstance: (field: string) => ComponentPublicInstance | null
+  /** 获取 api-select 字段的 options，raw=true 时返回接口原始列表数据 */
+  getFieldOptions: GetFieldOptions
+  /** 获取 api-select 字段的加载状态 */
+  isFieldLoading: (field: string) => boolean
 }
 
 /** 时间字段映射 [表单字段, [开始字段, 结束字段], 格式?] */