https://github.com/eldoy/vedit

Vue Editor Component based on Quill.js
https://github.com/eldoy/vedit

drag-and-drop editor quill resize upload video vue

Last synced: 6 days ago
JSON representation

Vue Editor Component based on Quill.js

• Host: GitHub
• URL: https://github.com/eldoy/vedit
• Owner: eldoy
• License: mit
• Created: 2018-09-30T00:27:43.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2018-10-11T04:22:54.000Z (about 6 years ago)
• Last Synced: 2024-09-17T01:43:46.416Z (about 2 months ago)
• Topics: drag-and-drop, editor, quill, resize, upload, video, vue
• Language: Vue
• Size: 33.2 KB
• Stars: 4
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Vue editor based on Quill.js

This build has built in support for:

* Upload image

* Drag and drop image as base64

* Insert Vimeo and Youtube video

* Resize and align video and image

* Copy paste text

* H2 and H3 tags

* Bold, italic, underlined, strikethrough

* Quotes, code, lists, text alignment

### INSTALL

```npm i vedit``` or ```yarn add vedit```

### USAGE

How to use from an example Editor.vue file:

```html

  


    

    

      

      


    

  


import Client from '@/lib/client'

import Vedit from 'vedit'

export default {

  name: 'Editor',

  components: { Vedit },

  created () {

    // Example upload client

    this.client = new Client({ url: 'http://example.com/upload' })

  },

  methods: {

    // Everytime you write something you can read the value of the editor here

    change (value) {

      console.log('CHANGE:', value)

    },

    // The upload handler for the client should be a function that takes input files

    // and returns a promise that resolves with file URLs.

    upload(urls) {

      console.log('UPLOADED:', urls)

    }

  },

  data () {

    return {

      client: null,

      content: '<p><img src="https://7ino.s3.amazonaws.com/1538111025472_umbrellas-small.jpg">Hello</p>'

    }

  }

}

```

MIT Licensed. Enjoy!