Programing

Reducx - 스프레드 연산자를 사용하여 깊이 중첩된 스토어 소품 업데이트

c10106 2022. 4. 7. 20:30
반응형

Reducx - 스프레드 연산자를 사용하여 깊이 중첩된 스토어 소품 업데이트

리액트+리플렉스를 사용하여 비교적 큰 웹 앱을 만들고 있는데, 내 가게를 상대하는 것이 정말 혼란스러워.

저장소에 중첩된 속성을 업데이트하는 데 문제가 발생하여 다음과 같은 작업을 수행해야 함을 나타내는 Redex 문서의 Imable Update Patterns 섹션을 찾았어.

function updateVeryNestedField(state, action) {
    return {
        ....state,
        first : {
            ...state.first,
            second : {
                ...state.first.second,
                [action.someId] : {
                    ...state.first.second[action.someId],
                    fourth : action.someValue
                }
            }
        }
    }
}

그리고 나는 그렇게 했고, 그 결과 내 환원기의 일부분은 이렇게 생겼다.

.
.
.
case "CHANGE_RANGED_INPUT": {
        return {
          ...state,
          searchPanel: {
            ...state.searchPanel,
            [action.payload.category]: {
              ...state.searchPanel[action.payload.category],
              rangedInputs: {
                ...state.searchPanel[action.payload.category].rangedInputs,
                [action.payload.type]: {
                  ...state.searchPanel[action.payload.category].rangedInputs[action.payload.type],
                  [action.payload.key]: {
                    ...state.searchPanel[action.payload.category].rangedInputs[action.payload.type][action.payload.key],
                    value: action.payload.value
                  }
                }
              },
            }
          },
        }
      }
.
.
.

내 코드가 점점 더 혼란스러워지고 있다는 것에 동의하는 것 같아.내 질문은 리듀렉스 문서들이 권고한 방법의 성과에 관한 것이 아니라(나의 경우 거의 매초마다 파견되는 행동을 위해 많은 일을 하는 것처럼 느껴지지만) 그리고 나는 그것이 최선의 방법이라고 생각한다.

내 질문은 내 코드의 가독성에 관한 것이다.환원기를 더 깨끗하게 만들 수 있는 방법이 있을까?

사실 나는 이 라이브러리가 제공하는 모든 기능이 필요해서가 아니라 하나의 기능만을 사용하기 위해 나의 거대한 형태에 react-remensx-form을 사용하고 있다. 이 라이브러리는 내가 많은 중첩된 것을 가진 거대한 형태 모델을 만들 수 있도록 해주고 내가 해야 할 일은 그것의 모델 경로를 입력에 추가해서 그것의 사전 정의된 변경 이벤트와 rela를 얻는 것이다.테드는 업데이트 가치.

이 도서관은 스프레드 오퍼레이터를 후드 아래에 두고 그렇게 하고 있는가?

일부 입력에 인덱스를 추가하고 입력 값이 변경될 때 해당 인덱스로 스토어의 관련 값을 업데이트할 수 있는 다른 방법이 있는가?

환원된 문서로 쓸 수 있는 수십 개의 유틸리티를 찾았어!불변 업데이트 유틸리티

그리고 난 점프로포즈-불가분하다고 생각해.

참조URL: https://stackoverflow.com/questions/44895304/redux-updating-deeply-nested-store-props-using-spread-operator

반응형