From 6e287de445e47798e952fc8c14031155431d99e4 Mon Sep 17 00:00:00 2001 From: Eduardo San Martin Morote Date: Thu, 8 Apr 2021 11:22:20 +0200 Subject: [PATCH] refactor(types): mapState autocomplete --- src/mapHelpers.ts | 51 +++++++++++++++++++++++------------------------ 1 file changed, 25 insertions(+), 26 deletions(-) diff --git a/src/mapHelpers.ts b/src/mapHelpers.ts index 4eaaffba..f242d58f 100644 --- a/src/mapHelpers.ts +++ b/src/mapHelpers.ts @@ -83,65 +83,65 @@ type MapStateObjectReturn< /** * Allows using state and getters from one store without using the composition * API (`setup()`) by generating an object to be spread in the `computed` field - * of a component. + * of a component. The values of the object are the state properties/getters + * while the keys are the names of the resulting computed properties. * * @example * ```js * export default { * computed: { * // other computed properties - * ...mapState(useCounterStore, ['count', 'double']) + * // useCounterStore has a state property named `count` and a getter `double` + * ...mapState(useCounterStore, { n: 'count', doubleN: 'double' }) * }, * * created() { - * this.count // 2 - * this.double // 4 + * this.n // 2 + * this.doubleN // 4 * } * } * ``` * * @param useStore - store to map from - * @param keys - array of state properties or getters + * @param keyMapper - object of state properties or getters */ -export function mapState( +export function mapState< + Id extends string, + S extends StateTree, + G, + A, + KeyMapper extends Record +>( useStore: StoreDefinition, - keys: Array -): MapStateReturn + keyMapper: KeyMapper +): MapStateObjectReturn /** * Allows using state and getters from one store without using the composition * API (`setup()`) by generating an object to be spread in the `computed` field - * of a component. The values of the object are the state properties/getters - * while the keys are the names of the resulting computed properties. + * of a component. * * @example * ```js * export default { * computed: { * // other computed properties - * // useCounterStore has a state property named `count` and a getter `double` - * ...mapState(useCounterStore, { n: 'count', doubleN: 'double' }) + * ...mapState(useCounterStore, ['count', 'double']) * }, * * created() { - * this.n // 2 - * this.doubleN // 4 + * this.count // 2 + * this.double // 4 * } * } * ``` * * @param useStore - store to map from - * @param keyMapper - object of state properties or getters + * @param keys - array of state properties or getters */ -export function mapState< - Id extends string, - S extends StateTree, - G, - A, - KeyMapper extends Record ->( +export function mapState( useStore: StoreDefinition, - keyMapper: KeyMapper -): MapStateObjectReturn + keys: Array +): MapStateReturn /** * Allows using state and getters from one store without using the composition * API (`setup()`) by generating an object to be spread in the `computed` field @@ -162,10 +162,9 @@ export function mapState< ): MapStateReturn | MapStateObjectReturn { return Array.isArray(keysOrMapper) ? keysOrMapper.reduce((reduced, key) => { - // @ts-ignore: sorry TS reduced[key] = function (this: Vue) { return getCachedStore(this, useStore)[key] - } + } as () => any return reduced }, {} as MapStateReturn) : Object.keys(keysOrMapper).reduce((reduced, key: keyof KeyMapper) => { -- 2.47.3