Как сделать минимальную ширину и высоту в vue-cropperjs?

Для установки минимальной ширины и высоты в vue-cropperjs, вам понадобится использовать свойство options.minCropBoxWidth и options.minCropBoxHeight. Вот, как вы можете настроить минимальные размеры в вашем компоненте Vue.js:

1. Установите vue-cropperjs с помощью npm:

npminstall vue-cropperjs

2. Импортируйте необходимые зависимости в вашем компоненте:

import Vue from 'vue'
import {VueCropper} from 'vue-cropperjs';
import 'cropperjs/dist/cropper.css';

3. Создайте вашу компоненту и добавьте тег vue-cropper к вашему HTML-шаблону:

export default {
  components: {
    VueCropper
  },
  data() {
    return {
      options: {
        minCropBoxWidth: 200, // минимальная ширина
        minCropBoxHeight: 200 // минимальная высота
      }
    }
  },
  methods: {
    onCrop() {
      // Обработчик события обрезания
      console.log('Обрезка изображения выполнена')
    }
  }
}

4. Добавьте тег vue-cropper в ваш HTML-шаблон:

<template>
  <div>
    <vue-cropper ref="cropper" :options="options" @crop="onCrop"></vue-cropper>
  </div>
</template>

Теперь, когда вы установили минимальные значения для ширины и высоты, пользователь не сможет обрезать изображение меньше указанных размеров.

Кроме того, в примере выше указан метод onCrop, который вызывается после завершения обрезки изображения. Вы можете использовать этот метод для дополнительных действий, которые вам может понадобиться выполнить после завершения обрезки.