最終反應形式的FieldArray的性能問題

Question

我制作了一個應用程序，在其中使用react-final-form的FieldArray組件 。 我的Array組件遇到性能問題。 每個組件還包含大約8個字段（每個字段都包含驗證規則）（也來自react-final-form），當我添加50多個元素時應用程序的滯后（將所有組件呈現到虛擬DOM中並將其與當前DOM進行比較）。 有人遇到麻煩了嗎？

如何避免這種情況？

Answer 1

為了防止整個列表重新呈現，您可以清除FieldArray組件中的所有訂閱。

 <FieldArray
      name="myList"
      subscription={{}} // This is required so that the whole array does not re-render on any change.
      render={(fieldsProps) => (fieldsProps.fields.map((name, index) =>
            { (...your function here...) })
  />