Dexie useLiveQuery hook causes the error "TypeError: dexie.liveQuery is not a function"

Question

昨天 npm 安装了 dexie 和 dexie-react-hooks。 package-lock.json 显示 dexie 3.0.3 和 dexie-react-hooks 1.0.7

使用模板“cra-template-pwa”创建了一个 React 应用

将 Dexie 站点上的文档用于基本的 Dexie DB 和 useLiveQuery，并在 React 中创建了这个简单的应用程序组件。

import React from 'react';
import Dexie from 'dexie'
import { useLiveQuery } from 'dexie-react-hooks'

const myDb = new Dexie('myTable');
myDb.version(1).stores(
  {
    items: "id,name,startDate,endDate"
  }
)

function App() {
  const items = useLiveQuery(myDb.items.orderBy('name'), []);

  const itemViews = items.map(item => { return <div>{item.name}</div> })

  return (
    <div className="App">
      <ul>
        {itemViews}
      </ul>
    </div>
  );
}

export default App;

当它在浏览器中运行时，应用程序无法显示，而是出现此错误：

TypeError: dexie.liveQuery is not a function
(anonymous function)
src/dexie-react-hooks.ts:14
  11 | // Make it remember previous subscription's default value when
  12 | // resubscribing (á la useTransition())
  13 | let currentValue = lastResult;
> 14 | const observable = liveQuery(querier);
     | ^  15 | return {
  16 |   getCurrentValue: () => currentValue,
  17 |   subscribe: (onNext, onError) => {

我们是不是做错了什么，或者这是一个错误？

Answer 1

您仍然需要安装 dexie@next 才能使用它（截至 2021 年 10 月）。支持 liveQuery 的新稳定版 dexie 即将推出。

yarn add dexie@next dexie-react-hooks@latest

或

npm i dexie@next dexie-react-hooks@latest