微信小程序

初始化页面：

• 每个页面都由wxml，wxss，js，json文件组成
• wxml，js必须存在，wxss和json可以省略
• css->wxss
• html->wxml
• wxml属于文本框（显示元素）类似于body
• wxss相当于css 设置文本样式（背景色，边距）
• 当公共样式和页面样式发生冲突，页面优先级更高，会覆盖公共样式
• .json 文件设置导航栏颜色 文本 字体颜色
• .js 模块间调用，逻辑关系设置

获取用户信息

获取用户头像和昵称

<open-data type="userAvatarUrl" class="head"> </open-data>  //获取用户头像
<open-data type="userNickName" lang="zh_CN"> </open-data>    //获取用户昵称

设置用户头像的大小

.head {
  height: 50px;
  width: 50px;
  display: block;       //必须把头像转化为块级元素，否则设置宽高无效
  border: 1px solid black;
}

• 让图片充满整个页面（父级），如果单独设置heigth:100%，图片不会生效，需要指定父级页面的高度，才能让子元素的100%生效，为了避免滚动，可以在父级元素添加overflow:hidden，固定页面。

组件使用

wx:for

• 在组件上使用 wx:for 控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该组件。
  默认数组的当前项的下标变量名默认为 index，数组当前项的变量名默认为 item
  {{index}} 数组下标
  {{item.number}} 数组里面属性为number的元素的值

wx:for的两种方式更改默认属性的名字，在多重嵌套循环时可以通过改变默认属性的名字，加以区分

• 使用 wx:for-item 可以指定数组当前元素的变量名，
  例如
  wx:for-item=‘qk’
  {{index}} 访问数组下标(没有改变下标的名字，所以还是默认的index)
  {{qk.number}} 访问数组里面的元素

• 使用 wx:for-index 可以指定数组当前下标的变量名：
  例如 wx:for-index=‘qk’
  {{qk}} 访问数组下标
  {{item[qk].number}} 下标为index的数组里面属性为number的元素的值 可以省略数组下标[index]
  {{item.number}} //这样遍历也是对的

---

• wx.showToast()
  类似于alter()，提示信息。

• 冒泡事件，当点击子view，会触发其父view的点击事件。(bindtap会造成这种情况)
  使用catchtap绑定事件，就可以避免冒泡事件的发生。

• action-sheet和action-sheet-item组合使用，类似于swiper组件，一般由一个按钮触发，触发前设置hidden属性为true,出发后通过setData改变data里面代表hidden的值达到“弹出”的效果

• loading标签的hidden属性的值，觉得加载界面的显示与否

• 光设置drstation还不够，还需要绑定一个隐藏事件bindchange

• consel.dir(object)
  打印对象，并且让对象以树状的结构显示。

• 不同的事件触发相同的事件处理函数，为了区分是谁触发的，可以在事件的属性中加入data-属性名：“属性值”，的方式，可以在控制台通过consle.dir(obj.target.dataset)，打印出来。或者触发事件处理函数的事件的属性及属性值。
  e.target 打印的是点击事件的元素
  e.target.dataset 打印的是点击事件元素里所有以data-开头的属性的集合。

• wx:if和hidden，都可以通过布尔值的真假来判断需不需要“渲染”一个组件
  但是当wx:if为false时，组件是不存在的，没有渲染的，hidden是渲染了通过display:nine，把渲染后的元素隐藏了。

• 把wx:for放在block标签里面，可以控制渲染的范围。

• bindchange
  当输入框输入完毕，失去焦点时触发

• bindinput
  每输入一个字符都会触发(同步获取)

• 逻辑层的数据要想更新视图层的数据，必须通过setData