|
@@ -3,11 +3,12 @@
|
|
|
* 可用于 vben-form、vben-modal、vben-drawer 等组件使用,
|
|
|
*/
|
|
|
|
|
|
-import type { Component, SetupContext } from 'vue';
|
|
|
+import type { Component } from 'vue';
|
|
|
|
|
|
import type { BaseFormComponentType } from '@vben/common-ui';
|
|
|
+import type { Recordable } from '@vben/types';
|
|
|
|
|
|
-import { h } from 'vue';
|
|
|
+import { defineComponent, getCurrentInstance, h, ref } from 'vue';
|
|
|
|
|
|
import { ApiComponent, globalShareState, IconPicker } from '@vben/common-ui';
|
|
|
import { $t } from '@vben/locales';
|
|
@@ -41,10 +42,30 @@ const withDefaultPlaceholder = <T extends Component>(
|
|
|
component: T,
|
|
|
type: 'input' | 'select',
|
|
|
) => {
|
|
|
- return (props: any, { attrs, slots }: Omit<SetupContext, 'expose'>) => {
|
|
|
- const placeholder = props?.placeholder || $t(`ui.placeholder.${type}`);
|
|
|
- return h(component, { ...props, ...attrs, placeholder }, slots);
|
|
|
- };
|
|
|
+ return defineComponent({
|
|
|
+ inheritAttrs: false,
|
|
|
+ name: component.name,
|
|
|
+ setup: (props: any, { attrs, expose, slots }) => {
|
|
|
+ const placeholder =
|
|
|
+ props?.placeholder ||
|
|
|
+ attrs?.placeholder ||
|
|
|
+ $t(`ui.placeholder.${type}`);
|
|
|
+ // 透传组件暴露的方法
|
|
|
+ const innerRef = ref();
|
|
|
+ const publicApi: Recordable<any> = {};
|
|
|
+ expose(publicApi);
|
|
|
+ const instance = getCurrentInstance();
|
|
|
+ instance?.proxy?.$nextTick(() => {
|
|
|
+ for (const key in innerRef.value) {
|
|
|
+ if (typeof innerRef.value[key] === 'function') {
|
|
|
+ publicApi[key] = innerRef.value[key];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return () =>
|
|
|
+ h(component, { ...props, ...attrs, placeholder, ref: innerRef }, slots);
|
|
|
+ },
|
|
|
+ });
|
|
|
};
|
|
|
|
|
|
// 这里需要自行根据业务组件库进行适配,需要用到的组件都需要在这里类型说明
|