关于ionic的一些坑(2)

时间:2021-06-09 02:58:25

如果你通过查阅相关文档,ionic的项目框架已经搭好,下面我来总结一下我在项目中所遇到的坑,给还没踩过的人以方便,给自己以勉励:

(1)关于android和ios的适配

因为ionic默认的tabs状态是位于每个页面的二级标题处,并没有位于底部,不过有相关的配置可以设置:

$ionicConfigProvider.scrolling.jsScrolling(true);

$ionicConfigProvider.platform.ios.tabs.style('standard');

$ionicConfigProvider.platform.ios.tabs.position('bottom');

$ionicConfigProvider.platform.android.tabs.style('standard');

$ionicConfigProvider.platform.android.tabs.position('standard');

$ionicConfigProvider.platform.ios.navBar.alignTitle('center');

$ionicConfigProvider.platform.android.navBar.alignTitle('bottom');//默认为left

$ionicConfigProvider.platform.ios.views.transition('ios');

$ionicConfigProvider.platform.android.views.transition('android');

$ionicConfigProvider.views.swipeBackEnabled(false);

(2)关于ionic路由配置的cache以及刷新问题

在路由里面配置cache缓存,一定要慎用,有时候你跳转到新页面的时候,数据并没有刷新,此时采用跳转后{reload:true},同时采用cache:false就可以实现数据刷新,但也由此会衍生出其他稀奇古怪的问题,所以建议还是不要用此方法刷新,最好的办法是采用

$scope.$on("$stateChangeSuccess",function(){​

//你的数据展现

})

来实现数据刷新

(3)关于返回上一级或者多级的问题

关于返回的思路,

1、用路由状态返回

2、用ionic框架里边自带的标签属性返回

但是我在用的时候,突然发现这里返回是好的,但是在加入数据以后,就会出现返回错乱的问题,并没有返回到我想指定的地方,此时我通过查阅得到可以再配置中添加依赖$ionicHistory,然后采用浏览历史查看的返回方式进行,$ionicHistory.goBack();采用此方法可在$ionicHistory.goBack()中添加参数,例如$ionicHistory.goBack(-2);就返回上上层页面,不过切忌不能写成$ionicHistory.goBack(“-2”);的形式,会报错的

(4)关于$location.path() 的使用

此种用法也可用于跳转到指定页面,但是一般的跳转都是采用路由“tab.myindex”此种写法,但是一旦用了$location.path(),就需要写为

$location.path() == '/tab/myindex'此种形式,否则没有任何效果,同时记得添加依赖$location

(5)关于弹出框的一些问题

本来根据官方文档API,弹出框是没有任何问题的,关键是根据客户需求在弹窗口上面改造,例如

var OpenPhoto="<img style='height:50%; width:100%;'  src='"+pageFilepath+"'/>"

var confirmPopup = $ionicPopup.confirm({

title: '解密图片预览',

template: OpenPhoto,

buttons: [

{

text: '取消',

type: 'button-positive button-outline'

},

{ text: '确定',

type: 'button-positive button-outline',

},

]

});

在confirmPopup 方法中的template模板里面,官方文档里面是只有一个标签来呈现这里面的内容,但是现在项目需求要对里面的样式进行改进,我在里面写class类给样式,直接给样式都不可以,没办法,只好在外面定义了一个变量存起来,然后放进去,这样才可以达到预期的效果

  好了,今天先总结这几个,还有一些还没有整理好,待这你好之后再给大家分享,望咱中国的开源之路越走越广