2.0版本 ArrayField使用方式讨论

[NexxLuo]

场景：
由于@formily/antd中的ArrayTable无法满足需求，需要自行封装ArrayTable组件；

遇到的问题：
1.使用ArrayField时， props怎么传递到component下层去

解决方式：
component属性为一个数组，第二个参数即为props ：

 <ArrayField
            name="arrayTable"
            component={[MyArrayTable, props]}
        ></ArrayField>

使用renderProps的方式

     <ArrayField name="arrayTable">
            {() => {
                return <MyArrayTable {...props}></MyArrayTable>;
            }}
        </ArrayField>

2.使用ArrayField时，传递给ArrayField的name属性会导致路径多出一层（比如：a.b变成了a.b.arrayTable）。尝试使用basePath进行处理，但会导致页面卡死。
或许这就是@formily/antd中的ArrayTable内部是重新实现了一个ArrayBase而不是使用ArrayField的原因？

const ArrayTable = props => {
    const field = useField<Formily.Core.Models.Field>();
    let arr = field.address.toArr();
    let name = arr[arr.length - 1];
    let basePath = field.address.parent().toString();
    return (
        <ArrayField
            name="arrayTable"
            basePath={basePath}
            component={[MyArrayTable, props]}
        ></ArrayField>
    );
};

最终解决：
自定义的ArrayTable组件内部不需要再使用ArrayField了，只需要schema中指定type:"array"，useField拿到的就是ArrayField。
一定要指定type为array，否则useField拿到的不是ArrayField！！！

感谢大佬的耐心指导。。

[janryWang]

用法不对，ArrayTable内部不需要再使用ArrayField了，ArrayField应该作为它的父组件，具体使用案例已更新 https://react.formilyjs.org/api/components/array-field#%E8%87%AA%E5%AE%9A%E4%B9%89%E7%BB%84%E4%BB%B6%E7%94%A8%E4%BE%8B

[NexxLuo]

用了ArrayField的话路径就一定会多出一层。用ArrayField的原因主要是想调用arrayField.push这类方法。1.0中可以使用mutators.push。ArrayTable中没有这类方法的话就只有自行处理了。

[janryWang]

你使用useField是可以拿到push方法的呀，看我发你的文档例子

[NexxLuo]

用了ArrayField会导致路径多一层

[AganStr]

大佬，使用 SchemaField 怎么拿到 SchemaField.Array 的索引，增加一项怎么知道目前有几项了呢？

[janryWang]

大佬，使用 SchemaField 怎么拿到 SchemaField.Array 的索引，增加一项怎么知道目前有几项了呢？

onFieldReact里监听form.values.array.length就行了