Last active
June 8, 2021 03:58
-
-
Save hieunc229/76fd3c16cd15b8bde0ce9dc46ce135aa to your computer and use it in GitHub Desktop.
Example of using Vasern with React Hooks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React, { useState, useEffect } from "react"; | |
import MyDB from "./conn"; | |
import { | |
View, Text | |
} from "react-native"; | |
export function App() { | |
const [items, setItems] = useState(); | |
useEffect(() => { | |
if (!items) { | |
// Wait for the data to be loaded, then set initial items | |
MyDB.Todos.onLoaded(() => { | |
setItems(MyDB.Todos.data()); | |
}) | |
} | |
// Listen to changes | |
MyDB.Todos.onChange(({ changed }) => { | |
setItems(MyDB.Todos.data()); | |
}); | |
}, [MyDB.Todos, items]) | |
return <View> | |
{(items || []).map(item => <Text key={`item-${item.id}`}> | |
{item.name} | |
{item.completed ? 'Completed' : null} | |
</Text>)} | |
</View> | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Vasern from "vasern"; | |
const MyDB = new Vasern({ | |
schemas: [{ | |
name: 'Todos', | |
props: { name: 'string', completed: 'boolean' } | |
}] | |
}); | |
export default MyDB; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment