jayhgq/django-vue3-admin-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
55617d125d
django-vue3-admin-web/node_modules/vue-cropperjs
History
jayhgq 55617d125d 初始化
2025-10-20 21:21:14 +08:00
..
dist 初始化 2025-10-20 21:21:14 +08:00
.babelrc 初始化 2025-10-20 21:21:14 +08:00
CHANGELOG.md 初始化 2025-10-20 21:21:14 +08:00
LICENSE 初始化 2025-10-20 21:21:14 +08:00
package.json 初始化 2025-10-20 21:21:14 +08:00
README.md 初始化 2025-10-20 21:21:14 +08:00
VueCropper.js 初始化 2025-10-20 21:21:14 +08:00

README.md

vue-cropperjs

A Vue wrapper component for cropperjs.

NPM

Demo

Checkout here agontuk.github.io/vue-cropperjs

Installation

npm install --save vue-cropperjs

or

yarn add vue-cropperjs

You will also need css & style loader for webpack

Compatibility

Vue Version Package Version
3.x.x >=5.0.0
2.x.x 4.2.0
1.x.x 1.0.3

Usage

// Global
import Vue from 'vue';
import VueCropper from 'vue-cropperjs';
import 'cropperjs/dist/cropper.css';
Vue.component(VueCropper);

// Local
import VueCropper from 'vue-cropperjs';
import 'cropperjs/dist/cropper.css';
export default {
  components: { VueCropper}
}

...
<vue-cropper
  ref="cropper"
  :src="imgSrc"
  alt="Source Image"
  @ready="..."
  @cropstart="..."
  @cropmove="..."
  @cropend="..."
  @crop="..."
  @zoom="..."
>
</vue-cropper>
...

this.$refs.cropper.rotate(45);

See the example files & cropperjs documentation

Options

Name Type Required Description
src string -- Image source
containerStyle object -- Styling for the image container
imgStyle object -- Styling for the image
alt string -- Alternate text for the image

Crop related options

See cropperjs documentation for all posible options & methods.

Renamed Methods

  • relativeZoom from zoom
  • initCrop from crop

License

MIT