258资源分享网

十一期间没什么事，我试着写了一个微信小程序WeSJTU。现在，回过头来，把自己开发小程序的心得给总结一下。构思微信小程序的文档，比较难的部分，如数据绑定，其思想和 ...

 

 

 

十一期间没什么事，我试着写了一个微信小程序WeSJTU。现在，回过头来，把自己开发小程序的心得给总结一下。

构思

微信小程序的文档，比较难的部分，如数据绑定，其思想和AngularJS是非常相近的，而所谓的WXSS，基本上可以认为是CSS，只是不方便用SCSS了——WXSS原则上不支持级联，所以整个文档看下来基本上就能上手了。

先从简单有意思的开始吧，所以我设想了三个Tab：

同去。同去网是交大活动发布的主要阵地，它有很完善的API，可以通过GET请求返回活动列表、活动详情的JSON数据，另外还支持分页。

2048. 根据别人写的数字2048，打算改成文字2048——苟利国家生死以，岂因祸福避趋之，蛤蛤...

反馈。这一部分，想做一个简单的反馈功能，用户可以在小程序里反馈，我可以在网页上查看反馈内容列表。

代码 同去

活动列表页面，前端可以用小程序的列表渲染很方便地实现。

<scroll-view class="acts-list" scroll-y="true" bindscrolltolower="lower"> <block wx:for="{{actsList}}"> <view class="act-item" index="{{index}}" id="{{item.actid}}" catchtap="redictDetail"> ... </view> </block> <view class="load-more" hidden="{{moreHidden}}"> <view class="load-content"> <text class="weui-loading"></text> <text class="loading-text">玩命加载中</text> </view> </view> </scroll-view>

由于同去网不支持HTTPS,而小程序的wx.request发起的是HTTPS请求，所以需要在后端将请求转发一下。后端我用的是Node.js.

router.get('/acts', function(req, res, next) { var query = require('url').parse(req.url, true).query; var offset = query.offset; var order = query.order; var indexUrl = "?type=0&offset=" + offset + "&order=" + order; http.get(indexUrl, function(response) { var source = ""; response.on('data', function(data) { source += data; }); response.on('end', function() { source = JSON.parse(source); var actsList = []; var acts = source.result.acts; var actsLength = acts.length; for (i = 0; i < actsLength; i++) { var poster = acts[i].poster; var status = acts[i].time_status_str; var status_style = ''; if (!poster) { var index = Math.round(Math.random() * 6);