这款vue图片剪裁开源项目,简直逆天了!
编程微刊
共 1152字,需浏览 3分钟
·
2020-12-31 04:06
![](https://filescdn.proginn.com/c0e9a2436a6708070040f7c720192d61/f1a9b5909c3c062b2c9dee27a2eae222.webp)
npm install vue-img-cutter --save-dev
![](https://filescdn.proginn.com/b7aaf01b587234ea0de9f38dfb7faa3c/63558c59c97cdee8e28e42fcfa36bff2.webp)
安装完成之后可以看到package.json里面的关于插件vue-img-cutter版本信息
![](https://filescdn.proginn.com/cb1e651627cf9f4370ad73ab58b88657/b474c6786eade2f36914a240bfa0d835.webp)
import ImgCutter from 'vue-img-cutter'
export default {
components:{
ImgCutter
},
...
}
<ImgCutter v-on:cutDown="cutDown">
<button slot="open">选择图片button>
ImgCutter>
<template>
<div class="tab-container">
<ImgCutter v-on:cutDown="cutDown">
<button slot="open">选择图片button>
ImgCutter>
div>
template>
<script>
import ImgCutter from "vue-img-cutter";
export default {
components: {
ImgCutter,
},
};
script>
![](https://filescdn.proginn.com/bd047902d08c98339c671749d6f82ab6/a7ead9062efcfeaa434984e921185d68.webp)
![](https://filescdn.proginn.com/ebe447d4ceb54bb0a896a9ef913daa6d/8a601b85098404aadf5abddf9e3cd660.webp)
评论