Open andres-kovalev opened 2 months ago
This is intentionally, to have behavior consistent throughout all APIs. If you want to share the same ref, just observable(object)
(and store it!) first and then assign it to the property (e.g. const parent = observable({object})
). Or, if that object doesn't have to become observable use an annotation to indicate so, for example makeAutoObservable(this, { value: observable.ref})
.
https://mobx.js.org/observable-state.html#available-annotations
Please note that using observables in useEffect deps is an anti pattern, I recommend to set up a reaction inside a useEffect, and have MobX instead of React deal with the deps.
Thanks for the answer, especially for the link.
We were also thinking about converting an object into an observable, but it make the parent and child components know about each other's internals: parent component should wrap an object with observable()
only because child puts this object into an observable state. Probably it's better to wrap it on a child level and memoize:
const Child = ({ object }: Props) => {
const observableObject = useMemo(() => obervable({ object }), [object]);
...
}
WDYT?
yeah I think that should work.
On Thu, Sep 5, 2024 at 12:01 AM Andres Kovalev @.***> wrote:
Thanks for the answer, especially for the link https://mobx.js.org/react-integration.html#useeffect.
We were also thinking about converting an object into an observable, but it make the parent and child components know about each other's internals: parent component should wrap an object with observable() only because child puts this object into an observable state. Probably it's better to wrap it on a child level and memoize:
const Child = ({ object }: Props) => { const observableObject = useMemo(() => obervable({ object }), [object]);
... }
WDYT?
— Reply to this email directly, view it on GitHub https://github.com/mobxjs/mobx/issues/3917#issuecomment-2330221591, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAN4NBBBX2LJHZBEBGDRQG3ZU57K5AVCNFSM6AAAAABNUYW3RCVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDGMZQGIZDCNJZGE . You are receiving this because you commented.Message ID: @.***>
When I assign the same const object as a value of the same observable - I get different reference every time:
I understand
store.reactiveField
andconstObject
are different objects (the first one is a proxy for the second one), but it still looks counterintuitive and error prone to get a new reference every time. For instance, when this proxy is used as a dependency for a react hook:Is it possible to preserve the reference in a case when the actual proxy target has the same reference?
If there is a reason for such behavior, is there any workaround for that? At the moment the only idea I have is to keep the copy of the original (non-proxied) value and perform deep assign manually:
Intended outcome:
I expect the same reference can be reused (since the underlying value has not changed):
Actual outcome:
Reference is different every time:
How to reproduce the issue:
Here is the example code to reproduce:
Versions
^6.13.1