如何在devtools中显示React Hook + Mobx的复杂状态值？

Question

我正在使用react hooks + mobx，代码运行良好，但是在devtools中看不到状态值

如果状态是简单的原始值，则devtools可以显示它，但如果不是，则devtools仅显示'{...}'

const countData = {
  v1: 0,
  v2: 0
}

const Counter: React.FC = () => {
  const d = useLocalStore(() => countData)
  const add = useCallback(() => d.v1++, [])
  const add2 = useCallback(() => d.v2++, [])
  return useObserver(() => (<>
    <div>count: {d.v1}</div>
    <div>count2: {d.v2}</div>
    <button onClick={add}>add</button>
    <button onClick={add2}>add2</button>
  </>))
}

在devtools中，Hooks.LocalStore.State is '{...}'（不可扩展）。如果我删除v1或v2，则Hooks.LocalStore.State是实际状态值（数字）