码迷,mamicode.com
首页 > 其他好文 > 详细

Ionic的页面堆栈与Tabs菜单相遇的问题(栈只有一个)

时间:2018-01-17 00:10:31      阅读:194      评论:0      收藏:0      [点我收藏+]

标签:需求   变量赋值   strong   art   echart   切换   菜单   font   col   

本来的需求:

新建的Ionic项目是Tabs菜单,假设有两个选项卡 A 和 B,对应的两个页面的代码完全一样,使用了echarts 插件,并且使用了一个获取页面元素的方法,给自己的一个变量赋值,然后将echarts图写入到这个元素里面。

html中
<div id="chartContainer"></div>

ts中
this.chartContainer = document.getElementById(‘chartContainer‘);

 

这样导致的效果是:

两个页面上的echarts图,永远只有一个展示,另一个是空白的。在A 页面切换到B 选项卡的时候,A 能展示,B 为空白;反之亦然。

最后当我把其中一个的id更改了以后,就没有这个问题了。


我的理解是:

Tabs菜单有两个,但是页面堆栈只有一个,当我打开了A 页面,栈区里记录了A 页面的元素 <div id="chartContainer"></div> 。当我再打开B 页面的时候,A 页面并没有被销毁,它在栈区的变量也就没有移出去。此时再打开B 页面,通过document.getElementById(‘chartContainer‘); 获取到的元素,仍然是A 页面中的元素。所以B 页面才会是空白的。

我觉得我的理解是正确的,如有不对,请指正!

 

原创文章,欢迎转载,转载请注明出处!

Ionic的页面堆栈与Tabs菜单相遇的问题(栈只有一个)

标签:需求   变量赋值   strong   art   echart   切换   菜单   font   col   

原文地址:https://www.cnblogs.com/acm-bingzi/p/ionicTabsStack.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!