小程序笔记

此文章仍在编写和完善中。

• 小程序的api

https://developers.weixin.qq.com/miniprogram/dev/api/

• 语法

1、if..else

wx:if
wx:elif
wx:else

2、for

wx:for
wx:for-item
wx:for-index

• rpx和px

用rpx，可以自动适配各种分辨率，类似android的dp
图片尺寸一般用rpx
iphone6下，rpx和px是1/1的，所以优先在6的模式下开发
文字的大小一般还是固定用px，避免小分辨率下文字太小的问题

• Flex布局

布局建议用flex，比较简单

//整体是列布局
.container {
  display: flex;
  flex-direction: column;
}
//图片一般设置宽高即可
.head-image {
  width: 100%;
  height: 460rpx;
}
//头像图片跟title对齐，需要给头像和title都设置垂直居中
.avatar {
  height: 64rpx;
  width: 64rpx;
  vertical-align: middle;
}
//内部容器需要行布局，设置flex-direction为row
.author-date {
  flex-direction: row;
  margin-left: 30rpx;
  margin-top: 20rpx;
}

• 事件

bindtap和catchtap
catchtap不冒泡

• 使用template来实现代码的复用

template，只支持wxml和wxss，js不支持，对应的js只能写到引用模板的组件的js里面。