即使在变化时我也在处理旋转:
<div @change="handleRotate"></div> <script> export default { data: { rotate = 0 },methods: { handleRotate () { this.rotate = this.rotate + this.getRotateAngle(e.clientX,e.clientY) } } } </script>
现在,第二个this.rotate会在每次更改时运行.我该怎么做才能使第二次this.rotate仅在第一次运行handleRotate时应用?
解决方法
解决方式Vue方式:
您可以使用$once,它只会监听一次事件.
Listen for a custom event,but only once. The listener will be removed once it triggers for the first time.
你只需要将@once添加到@change,如下所示:
<div @change.once="handleRotate"></div> <script> export default { //No Change here } </script>
检查演示是否在fiddle中.
旧答案:
如果您不想为旋转设置初始值,则可以再增加一个变量:hasRotated以跟踪旋转是否已更改.最初将hasRotated设置为true,一旦旋转已更改,将hasRotated设置为false,如下所示:
<div @change="handleRotate"></div> <script> export default { data: { rotate: 123,hasRotated: false },methods: { handleRotate () { if(this.hasRotated){ this.rotate = this.rotate + this.getRotateAngle(e.clientX,e.clientY) this.hasRotated = false } } } } </script>
原文地址:https://www.jb51.cc/js/159609.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。