您的位置:首页 > 移动开发 > 微信开发

微信小程序(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
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  微信小程序