All Projects → pespantelis → Vue Crop

pespantelis / Vue Crop

Licence: mit
↔️ Crop directive for Vue.js

Programming Languages

javascript
184084 projects - #8 most used programming language

VueCrop

Crop events plugin for Vue.js 1.0

This is a directive for Jcrop 2.0.0.

See a live demo here.

Usage

Install via npm

Available through npm as vue-crop.

npm install --save vue-crop

Direct include

You can include it with a <script> tag when you have Vue itself included globally. It will automatically install itself, and will add a global VueCrop.

Use in templates

Then you can do this:

<img src="pic.jpg" width="600" height="400" v-crop:start="cropStart"/>

You should specify both the height and width attributes

See Jcrop documentation for all available events.

Set options

VueCrop.setOptions({
  setSelect: [10, 10, 100, 100],
  aspectRatio: 1,
  bgColor: 'red'
})

See Jcrop documentation for all available options.

License

VueCrop is released under the MIT Licence. See the bundled LICENSE file for details.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].