DEV Community

Fazail Alam
Fazail Alam

Posted on

Quickly takes notes in your vuejs dashboard or website.

#vue #vite #tailwindcss #vuequicknotes

Light
Dark

Installation

npm

Use npm to install.

npm i vue-quick-notes
Enter fullscreen mode Exit fullscreen mode

Usage 

import { VueQuickNotes } from "vue-quick-notes"; // style import is needed to work propperly import "vue-quick-notes/dist/style.css";
Enter fullscreen mode Exit fullscreen mode 
<VueQuickNotes label="Quick notes" v-model="text" />
Enter fullscreen mode Exit fullscreen mode

Use composable to access text or the open state

Composable 

import { useQuickNotes } from "vue-quick-notes"; let { text, open } = useQuickNotes(); console.log(text.value); console.log(open.value); // Use this value to show or hide quick-note
Enter fullscreen mode Exit fullscreen mode

You can also use ctrl+alt+k to quickly show the notes, easily customize the classes of button,parent element or textarea, take notes by using speech recognition feature.

check here for props, other than those props/attributes will be bind to the text area.

For more info check here

Top comments (0)