rpx单位

微信小程序支持rpx和rem单位，就rpx单位基本上能适配上所有的手机型号，值得尝试一下哦。

背景图

background-image 只能用网络url或者base64 . 本地图片要用image标签才行。

flex布局

微信小程序支持flex布局

网络请求数据

要先在微信公众平台设置域名

地址

设置 => 开发设置 => 服务器域名

只支持https://

数据来源：Easy Mock

以下为get请求

    
var that = this;
wx.request({
  url: 'https://www.easy-mock.com/mock/5acdb6cd623fc34554945469/dan/weixin', 
  data: '',
  header: {
    'content-type': 'application/json' // 默认值
  },
  success: function (res) {
    console.log(res.data.data);
    that.setData({
        list:res.data.data
    })
  }
})

以下为post请求

    
var that = this;
wx.request({
  url: 'https://www.easy-mock.com/mock/5acdb6cd623fc34554945469/dan/weixin', 
  data: ({
    page:1
    }),
  method:'post',//
  header: {
    'content-type': 'application/json' // 默认值
  },
  success: function (res) {
    console.log(res.data.data);
    that.setData({
        list:res.data.data
    })
  }
})

设置data

this.setData({
    goods_id: options.goods_id
  })

获取data

function getData(){
    var that = this;
    console.log(that.data.message)
}

页面传值

A页面 <navigator url="detail?goods_id={{item.id}}">

B页面

onLoad: function (options) {
  this.setData({
    goods_id: options.goods_id
  })

全局变量

app.js

App({
  onLaunch: function () {
 
  },
  globalData: {
    userInfo: null,
    name:'ShopsN' //在这里加入全局变量

  }
})

index.js

//获取应用实例
const app = getApp()

...

  data: {
    name: app.globalData.name,//在这里获取，然后在页面中正常引用
  }

  ...

push数组

var arr = this.data.historySearch;
arr.push(e.detail.value);
  this.setData({
    historySearch:arr
  })
...

本地存储数组

<!-- 存 -->
var arr = this.data.historySearch;
arr.push(e.detail.value);

wx.setStorage({
  key: 'search',
  data: arr
})

<!-- 取 -->
wx.getStorage({
  key: 'search',
  success: function(res) {
    console.log(res)
    that.setData({
      historySearch: res.data
    })
  },
})

时间

ios系统不支持2020-06-09 00:00:00，支持2020/06/09 00:00:00

<button open-type="share"></button>

onLoad() {
},
onShareAppMessage(res) {
  if (res.from === 'button') {
    console.log("来自页面内按钮分享")
  }
  return {
    path:"",
    title: "分享"
  }
},

微信小程序踩坑集