微官网项目总结

abstract：之前已经提交了一个总体完成的效果了,这个就写点源码吧1<!--index.wxml--> <view class="container"> <!-- 轮播图 --> <view class="swiper_content"> <swiper indicat

之前已经提交了一个总体完成的效果了,这个就写点源码吧1

<!--index.wxml-->
<view class="container">
<!-- 轮播图 -->
<view class="swiper_content">
<swiper indicator-dots="true" indicator-color="#A33" indicator-active-color="#fff" autoplay="true" interval="4000" circular="true">
<block wx:for="{{img}}" wx:key="">
<swiper-item>
<image src='{{item}}' class="item_img"></image>
</swiper-item>
</block>  
</swiper>
</view>
<!-- 轮播图结束 -->
<view class="news_content">
<view class="news_total"> -- 最新新闻 -- </view>
<!-- 新闻页面 -->
<block wx:for="{{list}}" wx:key="">
<view class="news_contents" >
<navigator url='../news/details?id={{item.id}}'>
<image src="{{item.img}}"></image>
<view class="news_text">
<view class="news_title">
{{item.title}}
</view>
<view class="news_desc">
{{item.title}}....
</view>
<view class="news_time">
--- {{item.add_time_s}}
</view>
</view>
</navigator>  
<view class="clear"></view>
</view>
</block>  
</view>
</view>

//index.js
//获取应用实例
var com = require("../../utils/util.js");

Page({
data: {
list : [],
img : []
},
onLoad: function (option) {
com.post("/api/home/index",{},"setContent",this);
},
setContent : function(res){
console.log(res);
this.setData({
list: res.new,
img: res.img,
});
}

})

公共文件调用接口

// common.js
var requestUrl = "http://www.admin.com/index.php";
function post(url,data,fun,that) {
if(url == ''){
return false;
}
url = requestUrl+url;
wx.request({
url: url, // 仅为示例，并非真实的接口地址
data: data,
header: {
'content-type': 'application/json' // 默认值
},
method : "POST",
dataType : "json",
success(res) {
that[fun](res.data.result);
// console.log(res.data)
},
fail : function(res){
console.log('请求失败');
return false;
}
})
}
module.exports.post = post

感觉小程序如果接口写好了 一切都好办多了

Correcting teacher：查无此人Correction time：2019-01-08 15:35:36
Teacher's summary：嗯，说的不错。所以我准备出了一套接口的课程。做熟悉了，对你来说很简单，加油。