weex 小结 -- <list>
可以包含各种子组件
<refresh style="width:750;padding:30;flex-direction:row;justify-content:center;" onrefresh="refresh" display="{{isShowRefresh}}"> <text style="text-align:center;">PULL TO REFRESH</text> <loading-indicator style="width:50;height:50;color:#3192e1;"></loading-indicator> </refresh>
// 在 refresh 方法中需要先将 刷新的布局 显示出来,在刷新完毕时将 布局 隐藏
refresh:function(){
var self=this;
self.isShowRefresh='show';
self.getPaper(self.paperUrl,function(results){
self.paperList=[];
self.isShowLoading='hide';
for(var i = 0; i < results.length; i++) {
var paper=results[i];
self.paperList.push(paper);
}
});
self.isShowRefresh='hide';
},
<cell> <div class="item" repeat="item in paperList"> <div class="exam-div" > <text class="exam" url="{{item.url}}" onclick="exam">参加考试</text> </div> </div> </cell>
// url="{{item.url}}"--- url 为自定义属性,并为他赋值,在 onclick 事件中可以通过 el.target.attr.url 获取该属性(el 代表了所点击组件的对象,可以通过 el.target.attr.*** 来获取该组件的属性值)
exam:function(e){
console.log('i am the callback '+e.target.attr.url);
var self=this;
var url=e.target.attr.url;
modal.toast({'message':url,'doation':1});
var params = {'url':url,'animated':'true'};
navigator.push(params, function(e) {});
},
<loading style="width:750;padding:30;justify-content:center;background-color:#cccccc;" onloading="loading" display="{{isShowLoading}}"> <text style="text-align:center;color:#3192e1;">正在加载。。。</text> </loading>