小程序设计基本微信小程序的校园生活助手系统

一、什么是后台交互？

二、后台数据交互与request封装

1、准备工作

2、后台数据交互

3、request封装

三、wxs的使用

1、使用wxs步骤

2、完整方法

wxs

function getState(state) {
    // 状态：0取消会议1待审核2驳回3待开4进行中5开启投票6结束会议，默认值为1
    if (state == 0) {
        return '取消会议';
    } else if (state == 1) {
        return '待审核';
    } else if (state == 2) {
        return '驳回';
    } else if (state == 3) {
        return '待开';
    } else if (state == 4) {
        return '进行中';
    } else if (state == 5) {
        return '开启投票';
    } else if (state == 6) {
        return '结束会议';
    }

    return '其它';

}
function getNumber(canyuze, liexize, zhuchiren) {
    var person = canyuze + ',' + liexize + ',' + zhuchiren;
    return person.split(',').length;
}
function formatDate(ts, option) {
    var date = getDate(ts)
    var year = date.getFullYear()
    var month = date.getMonth() + 1
    var day = date.getDate()
    var week = date.getDay()
    var hour = date.getHours()
    var minute = date.getMinutes()
    var second = date.getSeconds()

    //获取 年月日
    if (option == 'YY-MM-DD') return [year, month, day].map(formatNumber).join('-')

    //获取 年月
    if (option == 'YY-MM') return [year, month].map(formatNumber).join('-')

    //获取 年
    if (option == 'YY') return [year].map(formatNumber).toString()

    //获取 月
    if (option == 'MM') return [mont].map(formatNumber).toString()

    //获取 日
    if (option == 'DD') return [day].map(formatNumber).toString()

    //获取 年月日 周一 至 周日
    if (option == 'YY-MM-DD Week') return [year, month, day].map(formatNumber).join('-') + ' ' + getWeek(week)

    //获取 月日 周一 至 周日
    if (option == 'MM-DD Week') return [month, day].map(formatNumber).join('-') + ' ' + getWeek(week)

    //获取 周一 至 周日
    if (option == 'Week') return getWeek(week)

    //获取 时分秒
    if (option == 'hh-mm-ss') return [hour, minute, second].map(formatNumber).join(':')

    //获取 时分
    if (option == 'hh-mm') return [hour, minute].map(formatNumber).join(':')

    //获取 分秒
    if (option == 'mm-dd') return [minute, second].map(formatNumber).join(':')

    //获取 时
    if (option == 'hh') return [hour].map(formatNumber).toString()

    //获取 分
    if (option == 'mm') return [minute].map(formatNumber).toString()

    //获取 秒
    if (option == 'ss') return [second].map(formatNumber).toString()

    //默认 时分秒 年月日
    return [year, month, day].map(formatNumber).join('-') + ' ' + [hour, minute, second].map(formatNumber).join(':')
}
function formatNumber(n) {
    n = n.toString()
    return n[1] ? n : '0' + n
}

function getWeek(n) {
    switch (n) {
        case 1:
            return '星期一'
        case 2:
            return '星期二'
        case 3:
            return '星期三'
        case 4:
            return '星期四'
        case 5:
            return '星期五'
        case 6:
            return '星期六'
        case 7:
            return '星期日'
    }
}
module.exports = {
    getState: getState,
    getNumber: getNumber,
    formatDate:formatDate
};

index.wxml

<view class="indexbg">
    <swiper autoplay="true" indicator-dots="true" indicator-color="#fff" indicator-active-color="#00f">
        <block wx:for="{{imgSrcs}}" wx:key="text">
            <swiper-item>
                <view>
                    <image src="{{item.img}}" class="swiper-item" />
                </view>
            </swiper-item>
        </block>
    </swiper>
    <wxs src="/utils/comm.wxs" module="tools" />
    <view class="mobi-title">
        <text class="mobi-icon">❤</text>
        <text class="mobi-text">会议信息</text>
    </view>
    <block wx:for-items="{{lists}}" wx:for-item="item" wx:key="item.id" class="bg">
        <view class="list" data-id="{{item.id}}">
            <view class="list-img">
                <image class="video-img" mode="scaleToFill" src="{{item.image != null ? item.image:'/static/persons/8.jpg'}}"></image>
            </view>
            <view class="list-detail">
                <view class="list-title"><text>{{item.title}}</text></view>
                <view class="list-tag">
                    <view class="state">{{tools.getState(item.state)}}</view>
                    <view class="join"><text class="list-num">{{tools.getNumber(item.canyuze,item.liexize,item.zhuzhiren)}}</text>人报名</view>
                </view>
                <view class="list-info"><text>{{item.location}}</text>|<text>{{tools.formatDate(item.starttime,'YY-MM-DD hh-mm-ss')}}</text></view>
            </view>
        </view>
    </block>
    <view class="section">
        <text>到底啦</text>
    </view>
</view>