Confused about Computed Properties documentation

[maybebansky]

I need to have a value thats calculated from state, and updates when the state changes.

Im confused by that the docs say about Computed Properties https://valtio.pmnd.rs/docs/guides/computed-properties

// When count changes in the state proxy
state.count = 10
// Then snapshot's computed property does not change
console.log(snap.doubled) // 2

However, when you make a snapshot, calls to snap.doubled are effectively cached, because the value of an object getter is copied during the snapshot process.

This doens't seem to be the case for me. doubled is correctly updated when count changes:

https://codesandbox.io/p/sandbox/peaceful-tristan-mc3kfc?file=%2Fsrc%2FApp.js%3A13%2C42

import { useEffect } from "react";
import { proxy, useSnapshot } from "valtio";

const state = proxy({
  count: 1,
  get doubled() {
    return this.count * 2;
  },
});

export default function App() {
  const { count, doubled } = useSnapshot(state);

  useEffect(() => {
    setInterval(() => {
      const newCount = Math.round(Math.random() * 100);
      state.count = newCount;
    }, 1000);
  }, []);

  return (
    <div className="App">
      <p>count: {count}</p>
      <p>doubled: {doubled}</p>
    </div>
  );
}

What have I missed here?

Also, is my approach OK?

[dai-shi]

It's because useSnapshot returns a new snap object when count changes.

Yes, your code looks totally fine.