用vue的项目里需要对图片进行裁剪,于是使用了cropperjs,在使用的过程中也踩过一些坑,以下是在.vue文件里cropperjs的使用方法和经验教训总结:
在使用之前,先引入:
在项目里,运行:
在template里:
js代码:
整体效果:
css代码(比较长,本来想不贴上了,但是为了一下童鞋可以直接运行demo,还是贴上了,篇幅过长,望见谅):
整体图:
把以上这些代码放入你的项目,或者单独建个.vue放进项目,就可以实现这样的效果:
上面是我整理给大家的,希望今后会对大家有帮助。
相关文章:
Vue.js自定义事件的表单输入组件方法
vue注册组件的几种方式总结
使用use注册Vue全局组件和全局指令的方法