- 当前 Bug 的表现(可附上截图)
初始化阶段
重新渲染
- 预期表现
通过wx:if=''重新渲染后canvas标签有显示出来但是并没有在真机与模拟器上再次出现canvas图像
- 复现路径
- 提供一个最简复现 Demo
html
<view class='bac' bindtap='test'></view>
<view wx:if='{{show}}'>
<canvas style="width: 300px; height: 200px;" canvas-id="firstCanvas"></canvas>
</view>
css
.bac{
width: 100rpx;
height: 100rpx;
background: #000;
}
//js
Page({
data:{
show:true
},
test:function(){
let that = this;
if(that.data.show == true){
that.setData({
show:false
})
}else{
that.setData({
show:true
})
}
},
canvasIdErrorCallback: function (e) {
console.error(e.detail.errMsg)
},
onReady: function (e) {
// 使用 wx.createContext 获取绘图上下文 context
var context = wx.createCanvasContext('firstCanvas')
context.setStrokeStyle("#00ff00")
context.setLineWidth(5)
context.rect(0, 0, 200, 200)
context.stroke()
context.setStrokeStyle("#ff0000")
context.setLineWidth(2)
context.moveTo(160, 100)
context.arc(100, 100, 60, 0, 2 * Math.PI, true)
context.moveTo(140, 100)
context.arc(100, 100, 40, 0, Math.PI, false)
context.moveTo(85, 80)
context.arc(80, 80, 5, 0, 2 * Math.PI, true)
context.moveTo(125, 80)
context.arc(120, 80, 5, 0, 2 * Math.PI, true)
context.stroke()
context.draw()
}
})
是的,数据刷新后能够重新出来,但是现在只想用渲染的方式去控制,我这个首屏数据量比较大不可能切换一次刷新一次
你好,你提供的代码片段wxml乱码了,麻烦重新提供下能复现问题的代码片段,谢谢
直接复制啊,上面代码就是代码片段里的
代码片段不能用就没回应了么,copy技能都不用了么...
代码片段
wechatide://minicode/PmMHU5mZ7lmE
wx:if 是false 是销毁节点,
如果你只是隐藏的话,可以用display:none
改用hidden属性,首屏卡点就卡点了