Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Reactivity: add and expose a shallow function #674

Closed
jods4 opened this issue Jan 30, 2020 · 3 comments · Fixed by #689 or #711
Closed

Reactivity: add and expose a shallow function #674

jods4 opened this issue Jan 30, 2020 · 3 comments · Fixed by #689 or #711
Labels
✨ feature request New feature or request

Comments

@jods4
Copy link
Contributor

jods4 commented Jan 30, 2020

What problem does this feature solve?

In addition to reactive, readonly and shallowReadonly, add the missing shallow method and export it.

If one desires to a have reactive object, whose contents are not reactive (as an optimization or for explicitness), one has to call markNonReactive on every value set on a reactive object.
This is ok when initializing the object, but becomes a lot of effort when it has to be put at any place where a property is set to a new value.

The code to implement shallow already exists, as createGetter and createSetter accept two arguments isReadonly and shallow (consistency: why not isShallow?). In fact it's the only combination of flags out of the four possible that is missing.

What does the proposed API look like?

shallow method, makes a reactive object like reactive, readonly and shallowReadonly but doesn't make values returned by get reactive.
@jods4 jods4 mentioned this issue Jan 30, 2020
Closed
@yyx990803 yyx990803 added the ✨ feature request New feature or request label Jan 30, 2020
@dsseng
Copy link
Contributor

dsseng commented Feb 3, 2020

I'm working on this one now.

@dsseng dsseng mentioned this issue Feb 3, 2020
Merged
@jods4 jods4 mentioned this issue Feb 9, 2020
Merged
@jods4
Copy link
Contributor Author

jods4 commented Feb 19, 2020

I'm really wishing for a shallowRef in Vue core as well. @yyx990803 is it possible?

Typical use case is to store immutable/non-reactive (big) arrays or (deep) objects (for perf). E.g. if you want to display a large list and plan on setting the ref to a new array to avoid watching all array indexes (ties in with your comments about my fast mutable array).

Of course, it's trivial to build one out of @vue/reactivity but I feel like it's fundamental enough to be part of core.

@yyx990803
Copy link
Member

@jods fyi: e9024bf

@github-actions github-actions bot locked and limited conversation to collaborators Nov 15, 2023
1109176988 added a commit to 1109176988/core that referenced this issue May 23, 2024
@1109176988
feat(core): implement ref function for creating reactive ref objects
1c790c2 
This commit adds a new function called `ref` to the core of the codebase. The `ref` function allows developers to create reactive ref objects, which include a `value` property and a `reset` method. Internally, the `ref` function utilizes the existing `reactive` function to create the reactive object.

This change addresses the need for an easier way to create reactive ref objects. Previously, developers had to manually implement this functionality, leading to code duplication and potential errors. With the `ref` function, creating reactive ref objects becomes simpler and more consistent.

Details:
- Define the `ref` function to create reactive ref objects
- Include a `value` property in the ref object
- Implement the `reset` method to reset the value property to its initial value

Footer:
- Closes: vuejs#674
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
✨ feature request New feature or request
Projects
None yet
Milestone
No milestone
3 participants
@yyx990803 @jods4 @dsseng