Composition-api: Missing UnwrapRef export

Created on 11 Feb 2020  路  6Comments  路  Source: vuejs/composition-api

I wanted to switch a couple fields that belong together from individual ref()'s to a single reactive(). Since I am using TypeScript, I tried to import the UnwrapRef type, but instead of using the main import, it redirected me to its full path instead:

I can import this:

import { Ref } from '@vue/composition-api';

but need to do this for UnwrapRef:

import { UnwrapRef } from '@vue/composition-api/dist/reactivity/index.d';

has this been an oversight, or is there a reason (like, "probably don't want to use reactive at all")?

Edit: I also noticed that Refs seems to be missing?

has PR misalignment

Most helpful comment

Having it exported, would allow it use that instead of declaring it again, for example, I'm building an library with composables, and sometime I need to access to wrap/unwrap.

On my case I described the types:
https://github.com/pikax/vue-composable/blob/4613b2703d67a40005dcc12230303e74ac48caf0/packages/core/src/utils.ts#L6-L20

```ts
export type UnwrapType = T extends Ref ? R : T;
export type WrapType = T extends Ref ? T : Ref;

export function unwrap(o: RefElement): Element;
export function unwrap(o: RefTyped): T;
export function unwrap(o: RefTyped): T {
return isRef(o) ? o.value : o;
}

export function wrap(o: RefElement): Ref;
export function wrap(o: RefTyped): Ref;
export function wrap(o: RefTyped): Ref {
return isRef(o) ? o : ref(o);
}
```

EDIT: @vue/runtime-core exports UnwrapRef

EDIT2: There's a few functions not exported in this plugin, but exported on the vue-next, other example isReactive @vue/reactivity exports

All 6 comments

I'm no sure why you'd need that type.

Having it exported, would allow it use that instead of declaring it again, for example, I'm building an library with composables, and sometime I need to access to wrap/unwrap.

On my case I described the types:
https://github.com/pikax/vue-composable/blob/4613b2703d67a40005dcc12230303e74ac48caf0/packages/core/src/utils.ts#L6-L20

```ts
export type UnwrapType = T extends Ref ? R : T;
export type WrapType = T extends Ref ? T : Ref;

export function unwrap(o: RefElement): Element;
export function unwrap(o: RefTyped): T;
export function unwrap(o: RefTyped): T {
return isRef(o) ? o.value : o;
}

export function wrap(o: RefElement): Ref;
export function wrap(o: RefTyped): Ref;
export function wrap(o: RefTyped): Ref {
return isRef(o) ? o : ref(o);
}
```

EDIT: @vue/runtime-core exports UnwrapRef

EDIT2: There's a few functions not exported in this plugin, but exported on the vue-next, other example isReactive @vue/reactivity exports

In my case I would like to use a reactive object (with isLoading, data and error), but because the type information is missing, I had to fall back to individual refs().

@spaceemotion what do you mean? can you provide an example of how you would expect it to happen?

This seems to be covered in #311

Yes we can close it once #311 is merged

Was this page helpful?
0 / 5 - 0 ratings

Related issues

ggedde picture ggedde  路  4Comments

swuecho picture swuecho  路  4Comments

ycmjason picture ycmjason  路  5Comments

carlmjohnson picture carlmjohnson  路  5Comments

TooBug picture TooBug  路  6Comments