Alias syntactic sugar of storeToRefs

[velly]

storeToRefs is a helper method to convert store reactive data to refs.
That's nice but I need help to find a way providing alias syntactic sugar.

Why?
Suppose I had design a interface on some functionallty(E.G,. HttpStore). Any store related to HTTP will have a loading state by inheritation.

So if want to use the ref of loading. it should be like this;
const { loading } = storeToRefs(AStore);

Imaging that I have a component that used more than one store that have loading state.
I have confilction in using loadign in one component;

const { loading } = storeToRefs(AStore);
const { loading } = storeToRefs(BStore);

Perfect way should be

const { loading as aLoading } = storeToRefs(AStore);
const { loading as bLoading} = storeToRefs(BStore);

Do I miss something? Or this feature would be supported?

[patriciorivera]

did you try

const { loading: aLoading } = storeToRefs(AStore);
const { loading: bLoading} = storeToRefs(BStore);

[velly]

did you try

const { loading: aLoading } = storeToRefs(AStore); const { loading: bLoading} = storeToRefs(BStore);

Limitation is still there

1. ref loading has the same type that is defined by interface.
2. ref loading ref was override.

I can offer a real use case:
I have two Store(.sth lik AStore and BStore) thoese hold the data and the loading status

A Store

{
loading: boolean,
data:A[]
}

B Stroe

{
loading: boolean,
data:B[]
}

now I want convert them into refs. and use them in Rxjs.
combineLatest(from(loading), from(loading)).pipe(......)

Obviously, it's impossible now. the same ref is overrided.

My temperay solotion is use whole refs. It's not that perfect as providing ref alias.

const aStoreRefs= storeToRefs(AStore);
const bStoreRefs = storeToRefs(BStore);

It's very strange that I suppose this could be a common usecase and nobody has issue on this?

[posva]

This is the correct answer as JS already has a syntax for renaming while destructuring. Another possibility is to call toRef():

const loadingA = toRef(store, 'loading')

[velly]

This is the correct answer as JS already has a syntax for renaming while destructuring. Another possibility is to call toRef():

const loadingA = toRef(store, 'loading')

Great!! Thanks!