由于微信小程序的独特性,会出现getIndex获取不到index的bug。需要动态传入页面滚动条滚动的距离offsetTop来解决该问题。
代码如下:
// 子组件代码
<template>
<view>
<qiun-data-charts
type="column"
:chartData="chartsDataColumn1"
:inScrollView="true"
:pageScrollTop="pageScrollTop"
canvasId="scroll-viewid"
@getIndex="getIndex"
/>
</view>
</template>
<script>
export default {
props: {
pageScrollTop: {
type: Number,
default: 0
}
},
methods: {
getIndex(e){
console.log(e)
}
}
}
</script>
// 父组件代码
<template>
<view>
<ChildComponent :pageScrollTop="pageScrollTop"></ChildComponent>
</view>
</template>
<script>
import ChildComponent from './ChildComponent '
export default {
components:{
ChildComponent
},
data() {
return {
pageScrollTop: 0
};
},
onPageScroll(e) {
this.pageScrollTop = e.scrollTop;
},
}
</script>