From: Eduardo San Martin Morote Date: Tue, 6 Apr 2021 18:16:41 +0000 (+0200) Subject: feat: mapState with array X-Git-Tag: v0.3.0~19 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=41a7ad0fbcedfbe33d340a476bc15545d92c2471;p=thirdparty%2Fvuejs%2Fpinia.git feat: mapState with array --- diff --git a/__tests__/mapHelpers.spec.ts b/__tests__/mapHelpers.spec.ts index 0b9ac834..4cd6410c 100644 --- a/__tests__/mapHelpers.spec.ts +++ b/__tests__/mapHelpers.spec.ts @@ -1,4 +1,11 @@ -import { createPinia, defineStore, mapStores, PiniaPlugin } from '../src' +import { + createPinia, + defineStore, + mapGetters, + mapState, + mapStores, + PiniaPlugin, +} from '../src' import { createLocalVue, mount } from '@vue/test-utils' import VueCompositionAPI, { nextTick, @@ -97,17 +104,43 @@ describe('Map Helpers', () => { }) }) - // mapStores(useStore).main().$patch({ n: 20 }) + it('mapGetters', () => { + expect(mapGetters).toBe(mapState) + }) + + describe('mapState', () => { + async function testComponent( + computedProperties: any, + template: string, + expectedText: string + ) { + const pinia = createPinia() + const Component = defineComponent({ + template: `

${template}

`, + computed: { + ...computedProperties, + }, + }) + + const wrapper = mount(Component, { localVue, pinia }) - const wrapper = mount(Component, { localVue, pinia }) - expect(wrapper.vm.main).toBeDefined() - const store = useStore() - expect(wrapper.text()).toBe('0 0') - expect(fromStore).toHaveBeenCalledTimes(1) + expect(wrapper.text()).toBe(expectedText) + } - store.n++ - await nextTick() - expect(wrapper.text()).toBe('1 1') - expect(fromStore).toHaveBeenCalledTimes(1) + it('array', async () => { + await testComponent( + mapState(useStore, ['n', 'a']), + `{{ n }} {{ a }}`, + `0 true` + ) + }) + + it('getters', async () => { + await testComponent( + mapState(useStore, ['double', 'notA', 'a']), + `{{ a }} {{ notA }} {{ double }}`, + `true false 0` + ) + }) }) }) diff --git a/src/index.ts b/src/index.ts index 97725ae7..f7363e62 100644 --- a/src/index.ts +++ b/src/index.ts @@ -15,6 +15,6 @@ export { PiniaCustomProperties, } from './types' -export { mapStores } from './mapHelpers' +export { mapStores, mapState, mapGetters } from './mapHelpers' // TODO: remove in beta export { createStore } from './deprecated' diff --git a/src/mapHelpers.ts b/src/mapHelpers.ts index cdca90ea..52ee8bac 100644 --- a/src/mapHelpers.ts +++ b/src/mapHelpers.ts @@ -1,4 +1,10 @@ -import { GenericStoreDefinition, Store, StoreDefinition } from './types' +import { + GenericStoreDefinition, + Method, + StateTree, + Store, + StoreDefinition, +} from './types' type StoreObject = S extends StoreDefinition< infer Ids, @@ -46,3 +52,24 @@ export function mapStores( return reduced }, {} as Spread) } + +type MapStateReturn = { + [s in keyof S | keyof G]: () => Store +} + +export function mapState( + useStore: StoreDefinition, + keys: Array +): MapStateReturn { + return keys.reduce((reduced, key) => { + reduced[key] = function () { + return useStore((this as any).$pinia)[key] + } + return reduced + }, {} as MapStateReturn) +} + +/** + * Alias for `mapState()`. You should use `mapState()` instead. + */ +export const mapGetters = mapState