canvas父级标签通过wx:if或hidden控制后,canvas不显示了?
import * as echarts from '../../components/ec-canvas/echarts';
var chart = null;
Page({
data: {
isModal: false,
ec: {
onInit: initChart
},
},
showDetail: function (e) {
const item = e.currentTarget.dataset.item;
const index = e.currentTarget.dataset.index;
item.grade = index + 1;
this.setData({
rankDetail: item,
isModal: true
});
this._showChart()
},
_showChart: function () {
const option = {
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed']
},
yAxis: {
type: 'value',
},
grid: {
y: 0,
left: 0,
containLabel: true,
bottom: 0,
top: 10,
right: 0
},
series: [
{
data: [120, 200, 150],
type: 'bar',
barWidth: '30%',
barCategoryGap: '10%'
}
]
};
chart.setOption(option);
},
});
function initChart(canvas, width, height, dpr) {
chart = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: dpr // new
});
canvas.setChart(chart);
return chart;
};
<l-popup show="{{isModal}}" content-align="top" z-index="{{zIndex}}" bind:lintap="closeModal">
<view class="popup">
<view class="flex-column popup_ranking">
<text class="popup_ranking_name">{{rankDetail.title}}</text>
<text class="popup_ranking_title">傻B行为指数榜</text>
<view class="flex-column popup_vote">
<text>{{rankDetail.grade}}</text>
<text>综合榜</text>
</view>
</view>
<view class="flex-space canvas_case">
<view class="canvas">
<ec-canvas id="mychart-dom-bar" canvas-id="mychart-bar" ec="{{ ec }}"></ec-canvas>
</view>
<view class="canvas_tital">
<text class="tital_A">没做过</text>
<text class="tital_B">偶尔做</text>
<text class="tital_C">经常做</text>
</view>
</view>
<button class="btn_detail" hover-class="btn_like" catchtap="toDetail">查看详情</button>
</view>
</l-popup>
是的,建议用hidden的办法隐藏,用if容易导致对象丢失
值是什么
没看懂你的问题,这个表现不对?