apiCloud小结

来源：互联网发布：淘宝旺旺怎么改名字编辑：程序博客网时间：2024/05/22 01:58

底部Tab切换

由于首页有轮播,如果支持底部tab的滑动切换会导致轮播无法手动滑动,所以我设置了禁用;默认是启用的;

apiready = function(){

api.openFrameGroup({
name: 'group1',
index:0,//当前 frame 索引
preload:0,
scrollEnabled:false,//是否支持滑动切换
rect: {
x: 0,
y: 0,
w: 'auto',
h: api.winHeight-50
},
frames: [{
name: '11',
url: './html/home1.html',
bgColor: '#fff',
},{
name: '22',
url: './html/home2.html',
bgColor: '#fff'
}, {
name: '33',
url: './html/home3.html',
bgColor: '#fff'
}]
}, function(ret, err) {
switch(ret.index){
case 0:
api.setFrameGroupAttr({ // 隐藏内容层
name: 'group3',
hidden:true,
});
api.setFrameGroupAttr({ // 隐藏内容层
name: 'group2',
hidden:true,
});
break;
case 1:
api.setFrameGroupAttr({ // 隐藏内容层
name: 'group3',
hidden:true,
});
api.setFrameGroupAttr({ // 隐藏内容层
name: 'group2',
hidden:false,
});
break;
case 2:
api.setFrameGroupAttr({ // 隐藏内容层
name: 'group3',
hidden:false,
});
api.setFrameGroupAttr({ // 隐藏内容层
name: 'group2',
hidden:true,
});
break;
}
var index = ret.index+1;
footerTab.setActive(index);
});

};

列表页进入详情页

需配合

通过每个区块加入不同的data-id

通过pageParam传参,进而更改url的参数获取不同数据

// 进入图文详情
var openPicDetail = function(obj){
var id = $api.attr(obj,'data-id');
var catid = $api.attr(obj,'data-catid');
api.openWin({
name:'detail_pic',
url:'detail_pic.html',
pageParam:{
catid:catid,
id:id
}
})
};
// 进入图文详情 end

详情页html页面

apiready = function () {
var catid = api.pageParam.catid; //获取列表页传来参数
var id = api.pageParam.id;
function detail_pic_content(){
// var _URL_ = window.location.href.split('?')[1]; 之前是用<a>跳转,发现很多问题,就找了文档,需要是用openWin函数
var myUrl = 'http://cms.xingtongnet.com/api.php?op=apicloud&action=show&catid='+catid+'&id='+id;
api.ajax({
url: myUrl ,
method: 'get',
data: {}
},function(result,err){
var data = result.data;
var outBox=$(
'<div class="aui-list aui-media-list">'+
'<h1>'+
'<img src="'+data.thumb+'" alt="">'+
'</h1>'+
'<div class="aui-list-item-title aui-font-size-14">'+data.title+'</div>'+
'<li class="aui-list-item aui-list-item-middle">'+
'<div class="aui-media-list-item-inner">'+
'<div class="aui-list-item-media" style="width: 3rem;">'+
'<img src="../image/liulangnan.png" class="aui-img-round aui-list-img-sm">'+
'</div>'+
'<div class="aui-list-item-inner">'+
'<div class="aui-list-item-text">'+data.username+'</div>'+
'<div class="aui-list-item-text date">'+formatDate(data.updatetime)+'</div>'+
'</div>'+
'</div>'+
'</li>'+
'<div class="content"><p>'+data.content+'</p></div>'+
'</div>'
);

$("#detail_pic_content").append(outBox);

});

}
detail_pic_content();
}

</script>

太久没做数据交互,数组嵌套数组数据获取想了半天

最后来个视频代码

api.ajax正确用法

api.ajax({    url: 'http://192.168.1.101:3101/upLoad',    method: 'post',    data: {values: {name: 'haha'}, files: {file: 'fs://a.gif'}}}, function (ret, err) {    if (ret) {        api.alert({msg: JSON.stringify(ret)});    } else {        api.alert({msg: JSON.stringify(err)});    }});

阅读全文

0 0