前端小菜鸡学习微信小程序的笔记

最近在学习做小程序，碰到一些知识点担心自己下次会忘记，所以做个笔记记下来备下次看~

wx.request封装：

const apiURL = 'http://xxx.xxx.com';
const wxRequest = (params,url) =>{
    wx.request({
      url,
      method:params.method || 'GET',
      data:params.data || {},
      header:{
        Accept:'application/json',
        'Content-Type':'application/json',
      },
      success(res){
        if(params.success){
          params.success(res);
        }
      },
      fail(res){
        if(params.fail){
          params.fail(res);
        }
      },
      complete(res){
        if (params.complete) {
          params.complete(res);
        }
      } 
    });
}

请求具体路径：

const getHotTripList = (params) => {
  wxRequest(params, `${apiURL}/v2/index/`);
};

带参：

const getPlaceInfoByID = (params) => {
  wxRequest(params, `${apiURL}/destination/place/${params.query.type}/${params.query.id}/`);
};

导出所定义的函数模块：

module.exports = {
  getHotTripList,
  getPlaceInfoByID,
};

然后下次要用到的时候直接引用就和，如：

const api = require('../../utils/api.js');
api.getExplorePlaceList({
    // 如若要传参：
    // data,
      success:(res)=>{
        console.log(res);
        self.setData({
          elements:res.data.elements
        });
      }
})

wxml二维数组循环：

<view class="destination">
  <block wx:for="{{ elements }}" wx:for-item="e" wx:key="e.index">
    <view class="title">{{ e.title }}</view>
    <view class="list">
      <view class="poi" wx:for="{{e.data}}" wx:for-item="poi" wx:key="poi.id" data-type="{{ poi.type}}" data-id="{{poi.id}}" data-name="{{poi.name}}" bindtap="viewPOI" >
        <image src="{{poi.cover_s}}"></image>
        <view class="mask"></view>
        <view class="name">{{ poi.name }}</view>
      </view>
    </view>
  </block>
</view>

二维数组循环，里层的一个点击事件如果想要传递参数跳转，则在标签里要加入data-xx="{{ xxx }}",然后在对应的js事件里使用e.currentTarget.dataset可获取。 如：

 viewPOI(e){
    const data = e.currentTarget.dataset;
    console.log(data);
 }