标签：变化 图片 技术分享 class val defaults com blog hang
项目中要实现的效果如下：
要求随着向左滑动实现图片的旋转效果，首先想到onchange事件，但是查看vue文档没有发现onchang命令，于是想到vue的watch钩子来监听滑动值的变化，从而调用组件的旋转功能。
代码如下：
<input id="defaultSlider" v-model="rotateVal" type="range" min="0" max="30"/>
1.v-model="rotateVal"绑定值到data中。
data() { return { id: ‘‘, name: ‘‘, coverPic: ‘‘, iptList: [], input: false, image: false, isEmpty: true, requireList: ‘‘, data: {data: {}, appid: api.appid, id: ‘‘}, inputs: {}, imgSrc: ‘‘, cropImg: imgUrl, crop: ‘‘, cropper: false, rotateVal: 0 } },
2.watch监听rotateVal
watch: { rotateVal: function (newVal, oldVal) { this.rotate(oldVal) } },
3.由组件实现旋转和裁剪
rotate (val) { this.$refs.cropper.rotate(val); },
标签：变化 图片 技术分享 class val defaults com blog hang
原文地址：http://www.cnblogs.com/lvhw/p/6687141.html
