如何避免因道具变更而重新渲染组件，以解决性能问题

Question

我有一个组件，可以在其中提交表单。我正在清理redux值。

submitForm.then(() => {
            setUserAssignModal(false);
            updateUserTrack({
              counterOrdersCount: trackUserVisit.counterOrdersCount + 1
            });
            handleOrderSubmit(userOrdersData);
            if (appliedDiscount) {
              this.handleRemoveDiscount();
            }

            setMoreOrderInfo({
              isPackingIncluded: false,
              userName: "",
              userPhone: "",
              selectedPaymentType: {
                id: null,
                mode: null
              }
            });
            navigation.navigate("Order");

因此，在导航之前，我的组件道具正在更改，其重新渲染了将近10次。 在将当前屏幕导航到订单屏幕后如何执行清理操作，以避免不必要的重新渲染？

Answer 1

似乎您有很多状态要在一个代码块中进行更新，这会导致不必要的重新渲染。您必须将状态保留在一个对象中，以便在将默认/初始状态传递给它时可以一次清除所有状态。如果您已经在使用Redux，则reducer可能做得很好。如果您的状态块是本地的，则可以尝试将它们全部集中在一个对象中，这样就可以减少重新渲染。