ionic 中ion-tabs动态加载问题

工作中遇到要动态的加载标签中的(很奇葩的需求),需求是如果后台返回两个分页,就在中插入两个,如果是一个,就插入一个,在百度上找了很久,都没有类似的文档,进一步证明这需求好奇葩。

首先我是使用下面的方式去做的

经过这样写,每次打开之后页面都是一片空白,通过html查看,发现后台传来的分页的确是加入到中的

ionic 中ion-tabs动态加载问题_第1张图片

但是页面是一片空白。问了公司的前端大神,前端大神说需要给设置selectedindex这个属性,要不然不知道加载的页面,毕竟是小白,按别人的方法放入了selectedindex属性 ,发现并没有什么作用,尴尬了。

通过查看ionic提供的这个组件的源码可以看到

ionic 中ion-tabs动态加载问题_第2张图片

当ion-tabs这个组件存在时,ionic就会取出ion-tab,然后创建相同数量的a标签,并且ionic默认是加载第一个分页的(创建)。

所以解决方法就是在后台数据没回来之前给ion-tabs不显示在页面上。数据回来后再显示,并且此时将ion-tab插入

也就是tabsisvis首先为false,等数据加载回来之后,置为true 

ionic 中ion-tabs动态加载问题_第3张图片

此时,成功完成了动态加载,并且页面也不再是一片空白 

如有不严谨的地方,请见谅,本人是前端小白,,,,,

你可能感兴趣的:(js)