Add a note or caution to the documentation for the `customRef` function. about docs

[demershov]

Hello @seeniOlabode
Yes, it seems that this is the case.

If you or someone takes a closer look, you will understand why this happens. However, I believe it would be beneficial to include this information in the documentation.

Thank you for your attention.

[seeniOlabode]

Hello, thank you for logging this.

I have tested this in the Playground and confirmed the unexpected behavior. Here’s a breakdown of what happens:

• Change Unrelated State: An unrelated state change in the parent component triggers its render function.
• Component Re-render: This causes the parent component to re-render, which includes re-evaluating Comp.vue.
• Evaluate CustomRef: The customRef's get() method is called again, returning a new object with the same structure as the previous value.
• Prop Comparison: During re-rendering, Vue compares the new and previous props of the child component.
• Perceived Prop Change: Although the objects are structurally identical, they are different instances. Vue perceives this as a prop change.
• Child Component Re-render: This perceived prop change triggers the child component to re-render and its watchers to react, despite no actual change in the logical state.
• This behavior occurs because the customRef does not trigger updates inside its set() method, leading to reactivity issues when the getter returns a new object instance.

Let me know if this is the case per your deductions.