fix(useArrayMap): allow return type matches the mapper function (#2172)

vueuse · Sep 5, 2022 · bc84ee2 · bc84ee2
1 parent 7b2887e
commit bc84ee2
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 3 deletions.
diff --git a/packages/shared/useArrayMap/index.test.ts b/packages/shared/useArrayMap/index.test.ts
@@ -26,4 +26,16 @@ describe('useArrayMap', () => {
     list.value.pop()
     expect(result.value).toStrictEqual([0, 2, 4, 6])
   })
+
+  it('should match the return type of mapper function', () => {
+    const list = ref([0, 1, 2, 3])
+    const result1 = useArrayMap(list, i => i.toString())
+    result1.value.forEach(i => expect(i).toBeTypeOf('string'))
+
+    const result2 = useArrayMap(list, i => ({ value: i }))
+    result2.value.forEach((item, idx) => {
+      expect(item).toBeTypeOf('object')
+      expect(item).toHaveProperty('value', idx)
+    })
+  })
 })
diff --git a/packages/shared/useArrayMap/index.ts b/packages/shared/useArrayMap/index.ts
@@ -12,9 +12,9 @@ import { resolveUnref } from '../resolveUnref'
  *
  * @returns {Array} a new array with each element being the result of the callback function.
  */
-export function useArrayMap<T>(
+export function useArrayMap<T, U = T>(
   list: MaybeComputedRef<MaybeComputedRef<T>[]>,
-  fn: (element: T, index: number, array: T[]) => T,
-): ComputedRef<T[]> {
+  fn: (element: T, index: number, array: T[]) => U,
+): ComputedRef<U[]> {
   return computed(() => resolveUnref(list).map(i => resolveUnref(i)).map(fn))
 }