diff --git a/packages/core/client/src/schema-component/antd/association-field/InternalCascadeSelect.tsx b/packages/core/client/src/schema-component/antd/association-field/InternalCascadeSelect.tsx
index e5a2e2c80..8d16538f7 100644
--- a/packages/core/client/src/schema-component/antd/association-field/InternalCascadeSelect.tsx
+++ b/packages/core/client/src/schema-component/antd/association-field/InternalCascadeSelect.tsx
@@ -45,6 +45,7 @@ const CascadeSelect = connect((props) => {
const resource = api.resource(collectionField.target);
const { getCollectionJoinField, getInterface } = useCollectionManager_deprecated();
const fieldNames = associationField?.componentProps?.fieldNames;
+ const [change, setChange] = useState(false);
const targetField =
collectionField?.target &&
fieldNames?.label &&
@@ -57,7 +58,7 @@ const CascadeSelect = connect((props) => {
}, [targetField]);
const field: any = useField();
useEffect(() => {
- if (value) {
+ if (value && !change) {
const values = Array.isArray(value)
? extractLastNonNullValueObjects(
value?.filter((v) => v.value),
@@ -73,7 +74,7 @@ const CascadeSelect = connect((props) => {
});
setSelectedOptions(options);
}
- }, []);
+ }, [value]);
const mapOptionsToTags = useCallback(
(options) => {
try {
@@ -140,6 +141,7 @@ const CascadeSelect = connect((props) => {
};
const handleSelect = async (value, option, index) => {
+ setChange(true);
const data = await handleGetOptions({ parentId: option?.id });
const options = [...selectedOptions];
options.splice(index + 1);
@@ -272,6 +274,13 @@ export const InternalCascadeSelect = observer(
return [{}];
};
const defaultValue = toValue();
+ useEffect(() => {
+ const isChange = selectForm.values?.select_array?.filter((value) => value && Object.keys(value).length);
+ if (collectionField.interface !== 'm2o' && props.value && !isChange.length) {
+ const value = extractLastNonNullValueObjects(defaultValue).filter((v) => v && Object.keys(v).length > 0);
+ selectForm.setValues({ select_array: value });
+ }
+ }, [props.value]);
const schema = {
type: 'object',
properties: {
@@ -315,26 +324,24 @@ export const InternalCascadeSelect = observer(
},
};
return (
- props.value !== null && (
-
- {collectionField.interface === 'm2o' ? (
-
- ) : (
-
- )}
-
- )
+
+ {collectionField.interface === 'm2o' ? (
+
+ ) : (
+
+ )}
+
);
},
{ displayName: 'InternalCascadeSelect' },
diff --git a/packages/core/client/src/schema-component/antd/association-field/InternalCascader.tsx b/packages/core/client/src/schema-component/antd/association-field/InternalCascader.tsx
index 7a81e202c..f6922859a 100644
--- a/packages/core/client/src/schema-component/antd/association-field/InternalCascader.tsx
+++ b/packages/core/client/src/schema-component/antd/association-field/InternalCascader.tsx
@@ -56,12 +56,12 @@ const Cascade = connect((props) => {
const changOnSelect = fieldSchema['x-component-props']?.changOnSelect || false;
const field: any = useField();
const [selectedOptions, setSelectedOptions] = useState([]);
- const [chang, setChang] = useState(false);
+ const [change, setChange] = useState(false);
const [dataList, setDataList] = useState({});
const { styles } = useStyles();
useEffect(() => {
const propsValue = props.value || fieldSchema['x-component-props'].value;
- if (!chang && propsValue) {
+ if (!change && propsValue) {
if (!propsValue.parent && !Object.keys(dataList).length) {
resource
.list({
@@ -116,7 +116,7 @@ const Cascade = connect((props) => {
};
const handleSelect = async (option) => {
- setChang(true);
+ setChange(true);
if (option) {
if (['o2m', 'm2m'].includes(collectionField.interface)) {
const fieldValue = Array.isArray(associationField.fieldValue) ? associationField.fieldValue : [];
@@ -243,6 +243,13 @@ export const InternalCascader = observer(
return [{}];
};
const defaultValue = toValue();
+ useEffect(() => {
+ const isChange = selectForm.values?.select_array?.filter((value) => value && Object.keys(value).length);
+ if (collectionField.interface !== 'm2o' && props.value && !isChange.length) {
+ selectForm.setInitialValues({ select_array: defaultValue });
+ }
+ }, [props.value]);
+
const schema = {
type: 'object',
properties: {