在uniapp上用zrender画一个方块并且绑定单击事件

好的，你可以按照以下步骤来实现：

1. 在uniapp项目中安装zrender库：

npm install zrender --save

2. 在需要使用的页面中引入zrender库：

import zrender from 'zrender';

3. 在页面中创建一个canvas元素，并初始化zrender：

<canvas id="myCanvas"></canvas>

export default {
  mounted() {
    const myCanvas = document.getElementById('myCanvas');
    const zr = zrender.init(myCanvas);
  }
}

4. 使用zrender创建一个矩形元素：

const rect = new zrender.Rect({
  shape: {
    x: 10,
    y: 10,
    width: 50,
    height: 50
  },
  style: {
    fill: '#ff0000'
  }
});

zr.add(rect);

5. 绑定单击事件：

rect.on('click', function() {
  console.log('矩形被单击了！');
});

完整代码如下：

<template>
  <canvas id="myCanvas"></canvas>
</template>

<script>
import zrender from 'zrender';

export default {
  mounted() {
    const myCanvas = document.getElementById('myCanvas');
    const zr = zrender.init(myCanvas);

    const rect = new zrender.Rect({
      shape: {
        x: 10,
        y: 10,
        width: 50,
        height: 50
      },
      style: {
        fill: '#ff0000'
      }
    });

    rect.on('click', function() {
      console.log('矩形被单击了！');
    });

    zr.add(rect);
  }
}
</script>