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

Question

我一次从 api 加载数据 5 条记录，我想第一次渲染 2 条记录，点击加载后又多了 2 条记录。Redux 字段数组<FieldArray name="facilityData"                        component={this.getFacilities}                    />返回函数它包括正在运行和渲染 redux 字段的 map 函数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

您可以使用 map 函数中的索引来控制应显示多少字段。返回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

  })

}