本人代码的app.vue内在页面加载时判断了手机还是电脑。之后的mobile.vue页面内的van-tab组件,我的卡片内容用了子组件的方式展示,但是子组件在页面第一次加载的时候不显示,刷新后正常显示。
问题代码如下
// app.vue内判断电脑还是手机
created(){
if (this._isMobile()) {
this.$router.push('/mobile');
} else {
this.$router.push('/pc');
}
}
//之后再monbile.vue页面内,用了van-tab组件,问题部分如下
<van-tab title="应力曲线">
<div class="m-line">
<Chart ref="chart_line"/>
</div>
</van-tab>
//这里的chart子组件在页面初次渲染的时候并未出现,在页面刷新后才能正常显示。初次渲染时子组件内部的echat函数正常运行,有返回值,也能选到该组件的div实例,但是不显示。
而且本人在尝试在van-tab的选项上添加点击事件的时候也不生效。图片如下
初次加载
刷新后
vant-tab组件里官方的一些懒加载和resize方法都试过了,并未起效。
如果我放弃app.vue内的移动端识别,开始就加载mobile.vue,就可以正常加载显示了。!
是不是create和识别函数的问题?本人半路出家,前端了解不是很熟,希望各位了解的人能帮忙分析下问题所在orz
你这个代码不全,不好判断,根据你的描述应该是数据初始化的问题。
看下如果将vant-tabs 屏蔽掉直接展示图表会是什么效果