https://github.com/stutrek/dexie-hooks

Hooks for Dexie
https://github.com/stutrek/dexie-hooks

dexie indexeddb react react-hooks

Last synced: about 1 month ago
JSON representation

Hooks for Dexie

• Host: GitHub
• URL: https://github.com/stutrek/dexie-hooks
• Owner: stutrek
• Created: 2019-10-30T02:37:08.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-04T23:44:07.000Z (almost 2 years ago)
• Last Synced: 2024-04-17T09:25:31.156Z (7 months ago)
• Topics: dexie, indexeddb, react, react-hooks
• Language: TypeScript
• Size: 318 KB
• Stars: 9
• Watchers: 3
• Forks: 0
• Open Issues: 16
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# dexie-hooks

## There is now an official replacement for this!

[See Dexie's official docs on `useLiveQuery`]()

## Old docs for reference

Dexie hooks make it easy to use Dexie in React. If you're using Dexie.Observable they will respond to changes to the database.

-   `useTable(db.table)` - uses an entire table.

-   `useItem(db.table, id)` - uses a single item in the table.

```typescript

import { useTable, useItem } from 'dexie-hooks';

import db from './my/db';

const AllUsersComponent: React.FC = props => {

    const [allUsers, loading, error] = useTable(db.users);

    if (loading) {

        return ;

    }

    if (error) {

        return 
{error.message}
;

    }


    return (

        


            {allUsers.map(user => (

                
{user.name}

            ))}

        

    );

};


const OneUserComponent: React.FC = props => {

    const [user, loading, error] = useItem(db.users, props.userId);

    if (loading) {

        return ;

    }

    if (error) {

        return 
{error.message}
;

    }


    return (

        


             {user.name}

        

    );

};

```