Skip to content

Commit 6967edb

Browse files
committed
docs: notifyOnChangeProps, structuralSharing 설명 추가
1 parent 7825f71 commit 6967edb

1 file changed

Lines changed: 25 additions & 0 deletions

File tree

README.md

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -660,6 +660,31 @@ const {
660660

661661
<br />
662662

663+
### notifyOnChangeProps
664+
665+
- notifyOnChangeProps: `string[] | "all" | (() => string[] | "all")`
666+
- 따로 설정하지 않으면, **컴포넌트에서 접근한 값이 변경되었을 때만** 리랜더링이 발생한다. (기본값)
667+
- 특정 프로퍼티가 변경되었을 때만 리랜더링이 발생하도록 설정할 수 있다. 예를 들어 `['data', 'error']`로 설정하면 `data` 또는 `error`가 변경되었을 때 컴포넌트가 리랜더링된다.
668+
- `'all'`로 설정할 경우 쿼리의 어떤 프로퍼티가 변경되든 컴포넌트는 리랜더링된다.
669+
- 참고: 기본 동작은 `Object.defineProperty()`를 활용한다.
670+
- [PR](https://github.com/TanStack/query/pull/1578/files#diff-93f379800fc8abf895eba249b2e2371eda98740aa40fc9f284a8088d190f46c3R506-R514)
671+
- [Object.defineProperty()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty)
672+
673+
<br />
674+
675+
### structuralSharing
676+
677+
- structuralSharing: `boolean | (<T>(oldData: T | undefined, newData: T) => T)`
678+
- 기본값은 `true`
679+
- 쿼리 결과값은 `structural sharing`을 사용하여 **실제로 데이터가 변경된 부분**만 레퍼런스가 변경되는데, `false`로 설정할 경우 이 기본 동작이 disable된다.
680+
- [Important defaults](https://tanstack.com/query/v4/docs/react/guides/important-defaults)
681+
- [structural sharing 개념](https://blog.klipse.tech/javascript/2021/02/26/structural-sharing-in-javascript.html)
682+
- 이전 데이터와 새 데이터를 비교하는 함수를 직접 작성하여 설정할 수 있다.
683+
- 참고: 기본 동작은 다음 함수를 활용하여 `structural sharing`을 적용한다.
684+
- [replaceEqualDeep](https://github.com/TanStack/query/blob/main/packages/query-core/src/utils.ts#L218)
685+
686+
<br />
687+
663688
## Parallel
664689

665690
[목차 이동](#주요-컨셉-및-가이드-목차)

0 commit comments

Comments
 (0)