zrender在uniapp上绑定事件失效
时间: 2023-10-10 08:11:34 浏览: 82
解决vue 绑定对象内点击事件失效问题
在uniapp中使用zrender绑定事件时,需要在zrender实例的init事件中进行事件绑定。例如:
```
<template>
<view class="container">
<canvas canvas-id="myCanvas" style="width: 100%; height: 100%;"></canvas>
</view>
</template>
<script>
import zrender from 'zrender';
export default {
data() {
return {
zr: null
}
},
mounted() {
this.init();
},
methods: {
init() {
this.zr = zrender.init(this.$refs.myCanvas);
// 绑定click事件
this.zr.on('click', (params) => {
console.log('click', params);
});
// 绑定mousemove事件
this.zr.on('mousemove', (params) => {
console.log('mousemove', params);
});
}
}
}
</script>
```
请注意,zrender需要在mounted生命周期中进行初始化,因为在此之前DOM元素可能还没有准备好。另外,需要在on方法中传入事件名称和事件处理函数,来绑定事件。
阅读全文