• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

mobx observable 객체의 트래킹 뎁스

22.03.14 11:25 작성 조회수 118

0

안녕하세요 mobx에서 observable 객체가 복잡해짐에 따라 어느 깊이까지 트래킹 되는지 테스트해보려 하다

공식문서를 보니 deep, shallow 등의 옵션이 있더라구요

구글링 했을 때는 사용법이 전부 데코레이터 기반이라 함수형에서는 어떻게 사용하는지 궁금합니다.

답변 1

답변을 작성해보세요.

0

makeObservable의 옵션으로 deep: false가 있습니다. 이걸 넣으시면 shallow가 됩니다.

빠른 답변 감사합니다! observable로 감싸는 방식에서는 어떻게 쓰면 될까요?

아래 코드에서 observable을 observable.shallow로 바꿨을 때 잘 동작하지 않더라구요

import React from "react";
import ReactDOM from "react-dom";
import { observable, action } from "mobx";
import { observer } from "mobx-react-lite";

const MyTodo = observable({
writer: "test",
TODO: {
depth1: {
depth2: {
depth3: 0
}
}
}
});

const increaseNumber = action(() => {
MyTodo.TODO.depth1.depth2.depth3 += 1;
});

increaseNumber();
const TodoView = observer(() => <span>isTracked?: {MyTodo.TODO.depth1.depth2.depth3}</span>);

ReactDOM.render(<TodoView />, document.body);

observable.shallow가 사용방법이라서 다른 방법은 모르겠습니다.