微信小程序

px与rpx：

px：微信小程序里面px跟web端px是不一样的，微信小程序里面的px指逻辑分辨率，即pt，比如iphone6下面：逻辑分辨率375*667，逻辑分辨率750*1334；如果是web端，那么直接按照750px的设计稿来就是1:1的关系；但是如果是在微信小程序里面，那么按照750px的设计稿来，那么就是0.5倍的关系，因为微信小程序里面，px指的就是逻辑分辨率，也可以认为就是屏幕宽度。

rpx：微信小程序里面定义的单位，即按照iphone6，物理像素为750的标准来定义，那么按照基准为750px的设计稿来看的话，就是1:1的关系

总结：iphone6下，px-->屏幕宽度，逻辑分辨率；rpx-->物理像素；1rpx = 0.5px

数据双向绑定小贴士：

setData(xxx)方法，不需要在data中初始化数据，可以直接设置；如

wxml代码 js代码 效果

事件对象target与currentTarget详解：

微信小程序API文档

例如绑定tap事件，即bindtap绑定函数时，点击触发函数，打印出e，会发现currentTarget指向的是触发该事件函数所绑定的对象，而target指向的是用户所真实触发对象；即

currentTarget：触发的函数它绑定的那个组件；即事件捕获的组件

target：实际触发的组件，跟触发函数无关

例子更容易让人理解，例子来啦~

wxml代码 js代码

点击inner view时，会打印出：

结果

以上的例子很明显，总之要记住，用户实际的操作，一定就是target；而currentTarget跟所触发的函数有关，它指的是绑定这个函数的组件。

（PS：可以顺道了解一下小程序的bind和catch哟，对于理解冒泡和捕获，以及实际开发中阻止冒泡和捕获有帮助~）

缓存同步和异步

同步：wx.setStorageSync(string key, any data)

异步：wx.setStorage(Object object)

结合实际需求，避免异步缓存出现回调地狱，也需要避免同步耗时，一般情况下，如果耗时不长一般使用同步

template内路径问题

template会被多个组件共用，所以一般路径使用绝对路径，因为template内的路径如图片路径，都是相对于引入template组件的路径决定的，就可能导致不同组件路径会不一样，读取不到的情况。

模板(https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxml/template.html)

模板：<template name=“xxx”>

引入模板的组件：<template is=“xxx” data=“{{...item}}”>

记得在即将引入模板的组件的wxml和wxss组件中分别 import模板和模板的样式：

<import src='xxx.wxml'>

@import 'xxx.wxss'

关于Swiper组件

swiper-item的宽高是默认100%的，要设置swiper-item的宽高，就要设置swiper的宽高，swiper-item才会随着变化，如果直接在swiper-item设置宽高，即使是行内样式，也是无效的。

比如下面的例子：代码中设置了行内样式，审查元素的时候发现没有设置成功

wxml例子 审查元素