diff --git a/packages/core/client/src/schema-component/antd/remote-select/RemoteSelect.tsx b/packages/core/client/src/schema-component/antd/remote-select/RemoteSelect.tsx index b309c1744..9d027c924 100644 --- a/packages/core/client/src/schema-component/antd/remote-select/RemoteSelect.tsx +++ b/packages/core/client/src/schema-component/antd/remote-select/RemoteSelect.tsx @@ -2,8 +2,9 @@ import { LoadingOutlined } from '@ant-design/icons'; import { connect, mapProps, mapReadPretty } from '@formily/react'; import { SelectProps } from 'antd'; import _ from 'lodash'; -import React from 'react'; +import React, { useMemo } from 'react'; import { ResourceActionOptions, useRequest } from '../../../api-client'; +import { useCompile } from '../../hooks'; import { defaultFieldNames, Select } from '../select'; import { ReadPretty } from './ReadPretty'; @@ -18,6 +19,7 @@ export type RemoteSelectProps
= SelectProps
& { const InternalRemoteSelect = connect( (props: RemoteSelectProps) => { const { fieldNames = {}, service = {}, wait = 300, ...others } = props; + const compile = useCompile(); const { data, run } = useRequest( { @@ -54,6 +56,15 @@ const InternalRemoteSelect = connect( }); }; + const options = useMemo(() => { + return ( + data?.data?.map((item) => ({ + ...item, + [fieldNames.label]: compile(item[fieldNames.label]), + })) || [] + ); + }, [data, fieldNames.label]); + return ( ); }, diff --git a/packages/core/client/src/schema-component/hooks/useFieldTitle.ts b/packages/core/client/src/schema-component/hooks/useFieldTitle.ts index db321b996..4a772c89f 100644 --- a/packages/core/client/src/schema-component/hooks/useFieldTitle.ts +++ b/packages/core/client/src/schema-component/hooks/useFieldTitle.ts @@ -1,6 +1,7 @@ import { Field } from "@formily/core"; import { useField, useFieldSchema } from "@formily/react"; import { useEffect } from "react"; +import { useCompile } from "./useCompile"; import { useCollection, useCollectionManager } from "../../collection-manager"; export const useFieldTitle = () => { @@ -9,9 +10,10 @@ export const useFieldTitle = () => { const { getField, } = useCollection(); const { getCollectionJoinField } = useCollectionManager(); const collectionField = getField(fieldSchema['name']) || getCollectionJoinField(fieldSchema['x-collection-field']); + const compile = useCompile() useEffect(() => { if (!field?.title) { - field.title = collectionField?.uiSchema?.title; + field.title = compile(collectionField?.uiSchema?.title); } }, [collectionField?.uiSchema?.title]); }