微信小程序开发总结

[pengjielee]

微信小程序设置全屏

//app.json
{
	"window": {
	  "navigationStyle": "custom" 
	}
}

微信小程序改变radio（单选钮）默认大小

radio {
  transform:scale(0.7);
}

微信小程序获取某个元素的宽度高度

wx.createSelectorQuery().select('#id').boundingClientRect(function(rect){
	console.log(rect)
}).exec();

wx.createSelectorQuery().selectAll('.classname').boundingClientRect(function(rects){
	console.log(rects)
}).exec();

微信小程序本地存储

try {
  wx.setStorageSync('theme', theme)
} catch (e) { }


try {
  const theme = wx.getStorageSync('theme') || '#c8e6c9'
} catch (e) { }


wx.getStorage({
	key: 'theme',
	success(res) {},
	fail(){},
	complete(){}
});

微信小程序设置导航条颜色

wx.setNavigationBarColor({
  frontColor: '#ffffff',
  backgroundColor: theme,
  animation: {
    duration: 400,
    timingFunc: 'easeIn'
  }
})

微信小程序裁切图片

var context = wx.createCanvasContext('canvas');

context.save();
context.beginPath();
context.rect(0, 0, width, height);  // 绘制裁切区域
context.clip();                     // 裁切
context.drawImage(imagePath,0,0);   // 控制图片
context.restore();

微信小程序下拉刷新

// app.json
01. 全局配置或页面配置
{
	"enablePullDownRefresh": true
}

02. 注册事件
onPullDownRefresh: function () {
  // to refresh
}