apicloud缓存

一、缓存详情页内容（归类：单个页面缓存数据，通过传入的 id 获取）：

<div class="detail" id="listData"></div>
<script id="section" type="text/doTtemplate">{{ }}<div class="des"><div class="com">所需积分： <span>{{=it.INTEGRAL}}</span> 分</div><    div class="com">兑换限量： {{=it.Num || '不限'}} </div><div class="com">配送说明： <span>免费包邮</span>（{{=it.PEISONG}}）</div></div>{{ }}
</script>

js部分：
思路：通过 api.readFile 根据 giftid 读取缓存数据，如果有，执行 if（）；如果没有，执行 else ，通过 ajax 请求获取数据并使用 api.writeFile 存储数据，方便下次获取。

function getDetailData(giftId){var cacheDir = api.cacheDir;api.readFile({path: cacheDir + '/' + giftId + '/' + api.frameName + '.json'}, function(ret, err){if(ret.status){var addDatalistCardTpl = doT.template(document.getElementById('section').innerHTML);document.getElementById("listData").insertAdjacentHTML('beforeEnd', addDatalistCardTpl(JSON.parse(ret.data)));}else{var param = {GIFT_ID: giftId}boktour._postAjax(boktour._url+'Integral.aspx',{UserId: $api.getStorage('LOGIN_DATA').UserId,CompanyId: $api.getStorage('LOGIN_DATA').CompanyId,Action: 'getProductDetail',Param: JSON.stringify(param)},function(ret){if(ret.Data && ret.Data!=''){api.writeFile({path: cacheDir + '/' + giftId + '/' + api.frameName + '.json',data: JSON.stringify(ret.Data)})var addDatalistCardTpl = doT.template(document.getElementById('section').innerHTML);document.getElementById("listData").insertAdjacentHTML('beforeEnd', addDatalistCardTpl(ret.Data));} else {document.getElementById("listData").innerHTML = '<div class="fa18 pd10">暂无更多详情</div>';}})}})
}

二、缓存 frameGroup 下的 frame 中列表数据内容（归类：多个 frame 缓存数据，通过 frame 获取的 id 获取数据）：

<div class="row pd list" id="listCard"> </div>
<script id="listBox" type="text/doTtemplate">{{ for(var i in it){ }}<div class="col-xs-4"><div class="item" tapmode ><img src="{{=it[i].PIC}}" alt="" /></div><div class="des">{{=it[i].LINETYPE_NAME}}</div></div>{{ } }}
</script>

js部分：

function getProductList(){var cacheDir = api.cacheDir, id;switch (api.frameName) {case '1':id = $api.getStorage('productGID');break;case '2':id = $api.getStorage('productCID');break;case '3':id = $api.getStorage('productZID');break;}api.readFile({path: cacheDir + '/' + id + '/' + api.frameName + '.json'}, function(ret,err){if(ret.status){var listBoxTpl = doT.template(document.getElementById('listBox').innerHTML);document.getElementById("listCard").innerHTML = listBoxTpl(JSON.parse(ret.data));}else{var param = {TYPE_FLAG: api.frameName}boktour._postAjax(boktour._url + 'Line.aspx',{UserId: $api.getStorage('LOGIN_DATA').UserId,CompanyId: $api.getStorage('LOGIN_DATA').CompanyId,Action: 'getLineType',Param: JSON.stringify(param)},function(RET){if(RET.Data && RET.Data.length > 0){api.writeFile({path: cacheDir + '/' + RET.Data[0].LINETYPE_ID + '/' + api.frameName + '.json',data: JSON.stringify(RET.Data)})var listBoxTpl = doT.template(document.getElementById('listBox').innerHTML);document.getElementById("listCard").insertAdjacentHTML('beforeEnd', listBoxTpl(ret.Data));switch (api.frameName) {case '1':$api.setStorage('productGID', RET.Data[0].LINETYPE_ID);break;case '2':$api.setStorage('productCID', RET.Data[0].LINETYPE_ID);break;case '3':$api.setStorage('productZID', RET.Data[0].LINETYPE_ID);break;default:break;}} else {document.getElementById("listCard").innerHTML = '<div class="fa18 pd10">暂无产品线路</div>';}})}})
}

板块一与板块二的区别：

板块一为单个页面，只需通过传入商品的 id，便可获得相关数据；可也判断是否有该 id 的数据。
板块二为 frameGroup 中的多个 frame，每个 frame 对应一个 id，在存入缓存时需要动态获取一个 id，在有相关数据时加载页面，动态获取 id，再通过该 id，获取缓存数据并加载。

结合以上例子说具体点就是：
1、板块二中需要以下代码获取 id，而板块一中只需用上一个页面传来的 id：

switch (api.frameName) {case '1':id = $api.getStorage('productGID');break;case '2':id = $api.getStorage('productCID');break;case '3':id = $api.getStorage('productZID');break;
}

2、板块二中需要以下代码存入 id，而板块一不需要：

switch (api.frameName) {case '1':$api.setStorage('productGID', RET.Data[0].LINETYPE_ID);break;case '2':$api.setStorage('productCID', RET.Data[0].LINETYPE_ID);break;case '3':$api.setStorage('productZID', RET.Data[0].LINETYPE_ID);break;default:break;
}

注：在 ajax 获取到数据后，使用 api.writeFile 存储数据时，需先将数据转格式，使用 api.readFile 读取数据时再转回来：

api.writeFile({path: cacheDir + '/' + RET.Data[0].LINETYPE_ID + '/' + api.frameName + '.json',data: JSON.stringify(RET.Data); //此处 JSON.stringify 转格式
})
api.readFile({path: cacheDir + '/' + id + '/' + api.frameName + '.json'
}, function(ret,err){if(ret.status){var listBoxTpl = doT.template(document.getElementById('listBox').innerHTML);document.getElementById("listCard").innerHTML = listBoxTpl(JSON.parse(ret.data)); //此处 JSON.parse 转格式
}

apicloud缓存相关推荐

直播房间竞拍实现-PHP7.3+swool扩展+redis缓存+Apicloud业务实现
基础环境要求->PHP7+redis+mysql5.6+swool 客户端支持->APIcloud环境+vuejs库+websocket支持 <?php /*** Created b ...
apicloud图片缓存的使用和查看清除缓存
一.缓存列表图片 //循环数据的时候加载执行一个缓存图片的函数<script type="text/x-dot-template" id="listT"& ...
如何开发出优秀的APICloud应用
APICloud定制平台项目实施规范 APICloud应用优化策略Top30 如何开发出运行体验良好.高性能的App 如何开发出客户满意.能够顺利交付的App 1. 引擎或模块问题: 遇到应用层无法解 ...
apicloud使用指南
ApiCloud ApiCloud平台介绍 ApiCloud首页在线教程文档 ApiCloud是一个国内的Hybird APP平台,提供Hybird APP一站式开发服务.可以将使用HTML.CSS ...
MUI调用原生自定义方法实现计算缓存与清空缓存
由于项目需要最近在做webapp开发用的是MUI框架,自己本来是做原生开发的,在开发的时候有一个需求是实现计算缓存和清除缓存的功能,原生java方法实现轻轻松松,网上代码一大把,不过是webapp倒是 ...
APICloud介绍
在APICloud创建了应用之后,应用的包结构如下图所示: 其中"config.xml"和 "index.html" 必须包含,其它均为可选."con ...
APICloud前端框架
1. 介绍 APICloud内置了一个APICloud 前端框架给我们操作APP页面和展示数据,也提供了ajax跨域请求数据功能. 它本质上就是一个仿照jQuery编写的一个小工具库,所以并不好用. ...
ApiCloud组件
在APICloud创建了应用之后,应用的包结构如下图所示: 其中"config.xml"和 "index.html" 必须包含,其它均为可选."con ...
APICloud常用
// apicloud存储全局信息 api.setPrefs({key: 'user_id',value: ret.id //赋值给user_id }); // apicloud获取存储在全局里的值 ...

apicloud缓存

apicloud缓存相关推荐

最新文章

热门文章