微信小程序(1)
2017-02-21 14:24
134 查看
flex.wxml:
<loading hidden="{{hidden}}" bindchange="loadingChange">
加载中...
</loading>
<scroll-view scroll-y="true" style="height: 100%;" bindscrolltolower="loadMore" bindscrolltoupper="refesh">
<view wx:if="{{hasRefesh}}" style="display: flex;flex-direction: row;align-items: center;align-self: center;justify-content: center;">
<icon type="waiting" size="45" />
<text>刷新中...</text>
</view>
<view wx:else style="display:none">
<text>没有更多内容了</text>
</view>
<view wx:for="{{goodsInfoList}}">
<view class="flex-row" style="display: flex;flex-direction: row">
<view>
<image src="http://img.114mall.com/{{item.imageImg1}}_300x300" class="flex-view-item" mode="scaleToFill"></image>
</view>
<view class="flex-column" style="display:flex;flex-direction: column;">
<text class="title">{{item.name}}</text>
<view class="view">
<text class="price">¥{{item.price/100}}</text>
<text class="price2">/</text>
<text class="price1">{{item.marketPrice/100}}</text>
</view>
<view class="view">
<text class="text1">已有{{item.sellCount}}人购买</text>
<text class="text1" style="margin-left: 30rpx;">所在地{{item.code}}</text>
</view>
</view>
</view>
</view>
<view class="tips1">
<view wx:if="{{hasMore}}" style="display: flex;flex-direction: row;align-items: center;align-self: center;justify-content: center;">
<icon type="waiting" size="45" />
<text>玩命的加载中...</text>
</view>
<view wx:else>
<text>没有更多内容了</text>
</view>
</view>
</scroll-view>
flex.js:
var app = getApp();
Page({
data: {
goodsInfoList: [],
hidden: false,
page: 1,
size: 20,
hasMore: true,
hasRefesh: false
},
onLoad: function () {
console.log("onLoad");
var that = this;
let map = new Map();
map.set("method", 'search.list');
map.set("shopId", "");
map.set("currentPage", "1");
map.set("categoryId", "");
map.set("order", "");
map.set("keywords", "");
network_util._post3(map, "1.0",
function (res) {
console.log(res);
that.setData({
goodsInfoList: res.data.result.goodsInfoList,
hidden: true
})
}, function (res) {
console.log(res);
});
},
onReachBottom: function (e) {
console.log("onReachBottom");
var that = this;
let map = new Map();
that.setData({
page: ++that.data.page
});
map.set("method", 'search.list');
map.set("shopId", "");
map.set("currentPage", that.data.page);
map.set("categoryId", "");
map.set("order", "");
map.set("keywords", "");
that.setData({
hasRefesh: true,
hidden: true
});
if (!this.data.hasMore) return
network_util._post3(map, "1.0",
function (res) {
console.log(res);
that.setData({
goodsInfoList: that.data.goodsInfoList.concat(res.data.result.goodsInfoList),
hidden: true,
hasRefesh: true,
})
}, function (res) {
console.log(res);
});
},
onPullDownRefresh: function (e) {
console.log("refesh");
that.setData({
hasRefesh: true,
});
var that = this;
let map = new Map();
that.setData({
page: 1
});
map.set("method", 'search.list');
map.set("shopId", "");
map.set("currentPage", that.data.page);
map.set("categoryId", "");
map.set("order", "");
map.set("keywords", "");
network_util._post3(map, "1.0",
function (res) {
that.setData({
goodsInfoList: res.data.result.goodsInfoList,
hidden: true,
hasRefesh: false,
});
}, function (res) {
console.log(res);
})
},
onReady: function () {
// 页面渲染完成
},
onShow: function () {
// 页面显示
},
onHide: function () {
// 页面隐藏
},
onUnload: function () {
// 页面关闭
},
loadingChange: function () {
console.log("loadingChange");
},
onShareAppMessage: function () {
return {
title: '自定义分享标题',
path: '/page/user?id=123'
}
},
refesh: function () {
console.log("saassasasasasa");
}
})
var network_util = require('../../utils/network_util.js');
var Util = require('../../utils/util.js');
https://github.com/lcs353732057/WeixinLittleProgramBy114MALL
相关文章推荐
- 模仿微信打飞机做的程序
- 微信小程序去哪里找 小程序到底如何使用(附小程序名单)
- 在一个Android应用程序中启动另一个程序(微信)
- 本地调试微信程序ngrok
- 安卓(Android)+苹果(Ios)仿微信、陌陌 移动社交APP系统源码,手机IM聊天软件源码,企业即时通讯APP程序源码
- 关注微信订阅号“程序视界”
- 微信签到程序-2014毕业五月
- 微信聊天记录查看器(程序+源码) - iOS版
- Android能否实现一键清理后台程序后程序自启动(类似QQ微信不被清理软件杀死)
- 你不能错过的 9 款好玩有用的微信小程序
- 微信服务器接口配置程序
- 基于微信api Android程序签名+代码混淆
- Android 实现微信,QQ的程序前后台切换:back键切换后台;点击通知栏恢复前台。
- 微信第三方开发程序中上传头像图片提示It is not safe to rely on the system's timezone settings
- Android打开指定程序(微博/微信/人人等)
- 如何在微信公众帐号开发模式下,通过程序代码向用户发送符号表情。
- 微信/易信公共平台开发(三):记录用户状态,优化程序结构
- 微信小程序-详解微信登陆、微信支付、模板消息
- 微信 开发 聊天机器人设计方案 java语言 程序和数据库代码
- 微信开发———让微信debug到自己的程序中;