Dexie.js icon indicating copy to clipboard operation
Dexie.js copied to clipboard

Vue liveQuery: Observable<any[]> is not assignable to parameter of type Observable<unknown>

Open sajjadalis opened this issue 2 years ago • 1 comments

Tried to use liveQuery with Vue TypeScript and I'm getting this error in VS Code.

Argument of type 'Observable<any[]>' is not assignable to parameter of type 'Observable<unknown>'. Type 'Observable<any[]>' is missing the following properties from type 'Observable<unknown>': source, operator, lift, forEach, and 2 more.ts(2345)

Here is my code.

<script setup>
import { liveQuery } from "dexie";
import { useObservable } from "@vueuse/rxjs";
import { db } from "@/db";

const invoices = useObservable(
  liveQuery(async () => {
    return await db.table("invoices").orderBy("created_at").toArray();
  })
)
</script>

Pretty new to TypeScript. Any help would be appreciated.

Thanks.

sajjadalis avatar Aug 17 '22 02:08 sajjadalis

From what I can tell if you want to use livequery with rxjs you will need to wrap it in a from() Dexie has it's own Observables

import { liveQuery } from "dexie";
import { useObservable, from } from "@vueuse/rxjs";
import { db } from "@/db";

const invoices = useObservable(
  from(
    liveQuery(async () => {
      return await db.table("invoices").orderBy("created_at").toArray();
    })
  )
)

I saw the suggestion here: https://github.com/dexie/Dexie.js/issues/1187

Jarod-K avatar Aug 29 '22 09:08 Jarod-K