! 제품 버전을 정확하게 입력해 주세요.
제품 버전이 정확하게 기재되어 있지 않은 경우,
최신 버전을 기준으로 안내 드리므로
더욱 빠르고 명확한 안내를 위해
제품 버전을 정확하게 입력해 주세요!

recoil 라이브러리 사용 시 에러 > Q&A | 토론

본문 바로가기

ReactJS recoil 라이브러리 사용 시 에러

페이지 정보

작성자 태호 작성일 2024-01-02 16:51 조회 107회 댓글 1건
제품 버전 : g
컨트롤 이름 : multirow

본문

안녕하세요


multirow cell, celledit 컴포넌트에서 custom component를 사용중인데


wjGrid.MultiRowCellTemplate 내부에서 custom component가

전역 상태 라이브러리인 recoil 관련 메서드를 호출하면 에러가납니다


해당 에러 관련해서 조치방법이있나요?


This component must be used inside a <RecoilRoot> component.

  • 페이스북으로 공유
  • 트위터로  공유
  • 링크 복사
  • 카카오톡으로 보내기

댓글목록

MESCIUS루시님의 댓글

MESCIUS루시 작성일

안녕하세요 메시어스입니다.

샘플 공유 감사드리며 내용 확인 후 답변드리도록 하겠습니다.

감사합니다.
메시어스 드림

3 답변

ReactJS Re: recoil 라이브러리 사용 시 에러

추천0 이 글을 추천하셨습니다 비추천0

페이지 정보

작성자 태호 작성일 2024-01-02 16:52 댓글 0건

본문

댓글목록

등록된 댓글이 없습니다.

ReactJS Re: recoil 라이브러리 사용 시 에러

추천0 이 글을 추천하셨습니다 비추천0

페이지 정보

작성자 MESCIUS루시 작성일 2024-01-09 16:43 댓글 5건

본문

안녕하세요 메시어스입니다.


먼저 오랜 기간 기다려주신 점 감사합니다.


해당 오류 메시지를 해결해기 위해서는 먼저 template으로 반환된 사용자 정의 컴포넌트는 Recoil hook의 "useRecoilState"를 사용하므로 아래 코드와 같이 "RecoilRoot"로 둘러싸여야 합니다. 이는 Recoil을 사용하여 유지되는 상태에 관련된 정보를 제공하기 위해서입니다. RecoilRoot 문서를 공유드리오니 참고 부탁 드립니다.


- RecoilRoot

 <MultiRowCellTemplate  cellType="Cell"
 template={(context) => {
	return (
        	<RecoilRoot>
                	<CustomComponent />
                 </RecoilRoot>
);}}/>


다만 공유해주신 샘플에서 버튼을 통해 페이지를 navigation을 할 때 데이터에서 그룹화가 적용되면서 별도 경고 메세지가 나옵니다. 이를 해결하기 위해서 workaround로 _getSingleRowGroupHeaderRange 메서드의 기본 코드를 덮어쓰는 것이 필요합니다. 수정 사항으로는 해당 열이 존재하는지 여부를 확인하고 존재하는 경우 해당 열의 집계 값을 확인하는 조건을 추가해주는 것입니다.


자세한 코드는 아래 샘플에서 확인할 수 있습니다.



감사합니다.

메시어스 드림

댓글목록

태호님의 댓글

태호 작성일

'_getSingleRowGroupHeaderRange' 속성은 private이며 '_MultiRowLayout' 클래스 내에서만 액세스할 수 있습니다.

태호님의 댓글

태호 작성일

위 내용 조치방법 답변 부탁드리겠습니다

태호님의 댓글

태호 작성일

또한 RecoilRoot 관련 부분에서 컴포넌트 내부에서 전역 상태를 공유하려면 root provider가 앱의 최상단에서 선언되어야합니다
조치방법으로 주신 각 컴포넌트 별로 provider를 제공하는 방법은 사용할수없습니다

태호님의 댓글

태호 작성일

Multiple <RecoilRoot>'s may co-exist and represent independent providers/stores of atom state; atoms will have distinct values within each root. This behavior remains the same when you nest one root inside anther one (inner root will mask outer roots), unless you specify override to be false (see "Props").

Note that caches, such as selector caches, may be shared across roots. Selector evaluations must be idempotent except for caching or logging, so this should generally not be a problem, however it is observable and may cause redundant queries to be cached across roots. Caches may be cleared using useRecoilRefresher_UNSTABLE().

MESCIUS루시님의 댓글의 댓글

MESCIUS루시 작성일

안녕하세요 메시어스입니다.

문의하신 내용은 현재 확인 중에 있으며 업데이트가 되는대로 안내드리도록 하겠습니다.

감사합니다.
메시어스 드림 

ReactJS Re: recoil 라이브러리 사용 시 에러

추천0 이 글을 추천하셨습니다 비추천0

페이지 정보

작성자 MESCIUS루시 작성일 2024-01-16 13:21 댓글 0건

본문

안녕하세요 메시어스입니다.


현재 Recoil 문의와 관련해서는 본사 개발팀이 추가 확인중에 있으며 먼저 TS 오류 메세지와 관련하여 안내드리도록 하겠습니다.


해당 오류 메세지는 JS에서 TS로 변환 과정 중에 나타난 것으로 추측되며 기본 기능에 덮어씌우기 위해 아래 코드와 같이 "any"로 설정해주시기 바랍니다. 

(_MultiRowLayout.prototype as any)._getSingleRowGroupHeaderRange = function (e, t, o) {...}

자세한 코드는 아래 샘플을 참고하여 주시기 바랍니다.


 


오랜 기간 기다려주신 점 감사드리며 아직 답변 드리지 못한 문의에 대해서도 업데이트가 되는대로 안내드리도록 하겠습니다.


감사합니다.

메시어스 드림


댓글목록

등록된 댓글이 없습니다.

메시어스 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기
메시어스 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기
이메일 : sales-kor@mescius.com | 전화 : 1670-0583 | 경기도 과천시 과천대로 7길 33, 디테크타워 B동 1107호 메시어스(주) 대표자 : 허경명 | 사업자등록번호 : 123-84-00981 | 통신판매업신고번호 : 2013-경기안양-00331 ⓒ 2024 MESCIUS inc. All rights reserved.