属性说明

    • canvas 标签默认宽度 300px、高度 225px，动态修改 canvas 大小后需要重新绘制。
    • 同一页面中的 canvas-id 不可重复，如果使用一个已经出现过的 canvas-id，该 canvas 标签对应的画布将被隐藏并不再正常工作。
    • canvas 在微信小程序、百度小程序中为原生组件，层级高于前端组件，请勿内嵌在 scroll-view、swiper、picker-view、movable-view 中使用。解决 canvas 层级过高无法覆盖，参考 。
    • canvas 在App端 vue 页面不是原生组件，目前App端 nvue 还不支持 canvas 组件。示例：
    2.     onReady: function (e) {
    3.         var context = uni.createCanvasContext('firstCanvas')
    5.         context.setStrokeStyle("#00ff00")
    6.         context.rect(0, 0, 200, 200)
    7.         context.stroke()
    8.         context.setStrokeStyle("#ff0000")
    10.         context.moveTo(160, 100)
    11.         context.arc(100, 100, 60, 0, 2 * Math.PI, true)
    12.         context.moveTo(140, 100)
    13.         context.arc(100, 100, 40, 0, Math.PI, false)
    14.         context.moveTo(85, 80)
    15.         context.moveTo(125, 80)
    16.         context.arc(120, 80, 5, 0, 2 * Math.PI, true)
    18.         context.draw()
    19.     },
    20.     methods: {
    21.         canvasIdErrorCallback: function (e) {
    22.             console.error(e.detail.errMsg)
    23.         }
    24. }

    相关 api：uni.createCanvasContext

    canvas的常用用途有图表和图片处理，在uni-app插件市场有大量基于canvas的插件，可搜索 、 头像裁剪 、 、 二维码 。

    发现错误？想参与编辑？