File tree Expand file tree Collapse file tree 2 files changed +43
-1
lines changed Expand file tree Collapse file tree 2 files changed +43
-1
lines changed Original file line number Diff line number Diff line change
1
+ # vue-use-dropzone
2
+
3
+ This is a vue implementation of [ ` react-dropzone ` ] ( https://github.com/react-dropzone/react-dropzone )
4
+ [ Documentation] ( https://react-dropzone.js.org/ ) is more or less identical
5
+ This was created as an experiment, if anyone is more interested in this library, feel free to contact me.
6
+
7
+ ``` shell
8
+ npm install vue-use-dropzone
9
+ ```
10
+
11
+ ### Example
12
+
13
+ ``` vue
14
+ <template>
15
+ <section>
16
+ <div v-bind="getRootProps()">
17
+ <input v-bind="getInputProps()" />
18
+ <p>Drag 'n' drop some files here, or click to select files</p>
19
+ </div>
20
+ <ul>
21
+ <li v-for="file in acceptedFiles" :key="file.path">
22
+ {{ file.path }} - {{ file.size }} bytes
23
+ </li>
24
+ </ul>
25
+ </section>
26
+ </template>
27
+
28
+ <script lang="ts">
29
+ import { defineComponent } from "vue-demi";
30
+ import { useDropzone } from 'vue-use-dropzone';
31
+
32
+ export default defineComponent({
33
+ setup() {
34
+ const { acceptedFiles, getRootProps, getInputProps } = useDropzone();
35
+ return { acceptedFiles, getRootProps, getInputProps };
36
+ },
37
+ });
38
+ </script>
39
+
40
+ ```
41
+
42
+
1
43
# Vue 3 + Typescript + Vite
2
44
3
45
This template should help get you started developing with Vue 3 and Typescript in Vite.
Original file line number Diff line number Diff line change 24
24
"build" : " vue-tsc --noEmit && vite build" ,
25
25
"serve" : " vite preview" ,
26
26
"prepare" : " yarn build" ,
27
- "release" : " np"
27
+ "release" : " npx np"
28
28
},
29
29
"dependencies" : {
30
30
"attr-accept" : " ^2.2.2" ,
You can’t perform that action at this time.
0 commit comments