作者：lu521
一、從服務器獲取數據
1.設置config
HTTP_BASE_URL_JSON :'https://api.bssolution.cn/apis'
2.請求服務器（三個get post unload）
function PostJSON (url,data, cb ){
wx.request({
method:'POST',
url: config.HTTP_BASE_URL_JSON + url,
data: data,
success: (res) => {
typeof cb == "function" && cb(res.data,"");
},
fail: (err) => {
typeof cb == "function" && cb(null,err.errMsg);
console.log("http請求:"+config.HTTP_url);
console.log(err)
}
});
};
3.綁定到http上
httpPostJSON: PostJSON
4.在該頁面的js中
寫入方法獲取數據，將該方法綁定在onload中（setData）
二、使用json數據
1.直接在頁面中應用
a.在該頁面的js上，在data中寫入數據 items:[{},{},{}]
b.遍歷到網頁中
wx:for="{{items}}" wx:key="{{item.id}}"
使用：{{item.title}}
二層遍歷的時候 wx:for="{{item}}"
使用：{{item}}
2.調用template模板
a.import引入模板
b.在該頁面的js上，在data中寫入數據
list_index_item1:{
items:[{},{},{}]
}
注：list_index_item1是模板的名字
c.遍歷到網頁中(同直接在頁面中應用的 b.)
二、點擊列表list進入不同的詳情頁detail
（在index上）
1.在服務器獲取數據
例如：http.httpGet("/v2/goods?page=1&per_page=10",{
appid:config.APPID,
},function(res){
var goods_list;
that.setData({
goods_list:res
});
});
2.在wxml頁面上遍歷數據
在上一個view遍歷數據，在下面的view上綁定事件，同時設置相應的id
例如：<block wx:for="{{goods_list.products}}" >
<view class="list_left_right_body" bindtap="tiao" id="{{item.id}}" >
<view class="list_left_right_img" >
<image src="{{item.default_photo.thumb}}" />
</view>
</view>
</block>
3.事件的編寫
第一步：獲取到相應的id
第二步：跳轉到相應的頁面
例如：tiao:function(e){
var id = e.currentTarget.id
wx.navigateTo({
url: '../details/detail?name=asdfads&id='+id,
})
}
（在detail上）
4.detail頁面引入參數
在onload方法里注入options參數，即可獲取
例如：onLoad:function(options){
console.log("event------------"+options.id);
console.log("event------------"+options.name);
}
5.從后臺上獲取detail頁面的數據
例如： onLoad:function(options){
var that = this;
var id = options.id;
var data = {id:id};
http.httpGet("/v2/detail?id="+id,data,function(res){
var goods_info = res;
that.setData({
goods_info: goods_info
});
console.log("goods_info------------"+goods_info);
console.log("goods_info-image------------"+res.photos[0].thumb);
});
}
6.在detail頁面插入數據
注：不需要wx:for=""遍歷，直接調用就可以
例如： <view class="title">{{goods_info.name}}</view>
<view class="price">￥{{goods_info.current_price}}</view>
<view class="number">成交筆數{{goods_info.sales_count}}</view>
