如何从Redux字段一次渲染2个字段

Question

我一次从api加载数据5条记录，我想第一次呈现2条记录，单击“加载”后又出现了另外2条记录。 Redux字段数组

<FieldArray name="facilityData"
                        component={this.getFacilities}
                    />

返回功能，它包括正在运行并渲染redux字段的地图功能

getFacilities = ({ fields, meta: { error, submitFailed } }) => {

return fields.map((facility, index) => {
return <div>{index}</div>
})
}

我已经实现了fields.slice（），但是此功能在Redux表单字段中不起作用

我尝试过

getFacilities = ({ fields, meta: { error, submitFailed } }) => {

        const setss = [...Array(fields)];
        console.log(setss);
    }

返回：

我想一次加载2条记录，如何使用fields.map函数添加中断。

Answer 1

您可以在地图功能中使用索引来控制应显示多少个字段。返回null将不呈现任何内容。不过，您需要自己处理fieldsToShow变量。

const fieldsToShow = 2; // could be pulled from state


getFacilities = ({ fields, meta: { error, submitFailed } }) => {
  return fields.map((facility, index) => {
    return index < Math.min(fieldsToShow, fields.length) ? <div>{/* Render the field */}</div> : null
  })
}