alibaba / formily

📱🚀 🧩 Cross Device & High Performance Normal Form/Dynamic(JSON Schema) Form/Form Builder -- Support React/React Native/Vue 2/Vue 3
https://formilyjs.org/
MIT License
11.12k stars 1.44k forks source link

[Bug Report] ArrayField使用对象字段,存在初始数据时,初始数据无法被删除。先remove初始条目再add会把初始数据加回来。 #3960

Closed yyl21 closed 10 months ago

yyl21 commented 10 months ago

I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

Edit on CodeSandbox

Steps to reproduce

import React from "react";
import { createForm, ArrayField as ArrayFieldType } from "@formily/core";
import {
  FormProvider,
  Field,
  ArrayField,
  useField,
  observer
} from "@formily/react";
import { Input, Button, Space } from "antd";

const form = createForm();

const ArrayComponent = observer(() => {
  const field = useField<ArrayFieldType>();
  return (
    <>
      <div>
        {field.value?.map((item, index) => (
          <div key={index} style={{ display: "flex-block", marginBottom: 10 }}>
            <Space>
              <Field name={[index, "type"]} component={[Input]} />
              <Field name={[index, "name"]} component={[Input]} />
              <Button
                onClick={() => {
                  field.remove(index);
                }}
              >
                Remove
              </Button>
            </Space>
          </div>
        ))}
      </div>
      <Button
        onClick={() => {
          field.push({
            type: "1"
          });
        }}
      >
        Add
      </Button>
    </>
  );
});

export default () => {
  form.setInitialValues({
    array: [
      {
        name: "aaa",
        type: "1"
      }
    ]
  });
  return (
    <FormProvider form={form}>
      <ArrayField name="array" component={[ArrayComponent]} />
    </FormProvider>
  );
};

点进codesandbox 先点remove 再点add 新增的条目跟初始条目数值一样

What is expected?

新增的条目应该只包含默认type, name应该为空

What is actually happening?

新增条目等于初始条目 { name: "aaa", type: "1" }

Package

@formily/react@2.2.29


初始有n条的情况下 add n次都会加上初始第n条

janryWang commented 10 months ago

可以把 setInitialValues 改成 setValues