微信小程序快速知识点

只是刚看文档的时候记下里的几点

• wx:if 　　true 渲染　　false不渲染
• hidden　会渲染，控制元素的display
• "{{boolean}}"　　不可以　"boolean"
• 　包装元素，不会做任何渲染
• bind+事件类型　会冒泡
  catch+事件类型　不会冒泡
• Flex布局
  flex-direction　主轴方向
  flex-wrap　换行
  父容器－－－justify-content　主轴对齐方式（右对齐 flex-end、左对齐 flex-start、居中 center、两边固定 space-between、等分 space-around）
  父容器－－－align-items　副轴对齐方式（上对齐 flex-start、下对齐 flex-end、居中 center、基线上baseline、被拉伸以适应容器 stretch）
  子容器－－－flex
  子容器－－－align-self
• 生命周期函数（下面是页面执行的顺序）
  onLoad　监听页面加载（只执行一次）
  onShow　监听页面显示（显示页面一次就执行一次）
  onReady　监听页面的初次渲染完成
  onHide　监听页面隐藏
  onUnload　监听页面卸载
• onReachBottom　监听用户上拉动作（上拉加载）
• onPullDownRefresh　监听用户下拉动作（下拉刷新）

以及工作中经常用到的几点

• 上拉加载更多，下拉刷新
  上拉加载更多：在page的json文件加enablePullDownRefresh:true，然后在该page的js文件加上方法onReachBottom
  下拉刷新：在page的js文件加上方法onPullDownRefresh
  在json文件中写上enablePullDownRefresh:true才可以上拉加载更多，下拉刷新
• 返回上一页且要刷新，重新获取新的数据，在onShow函数调用onLoad()
• 做一个活动内容切换tab栏的页面需要用组件swiper，但当内容过长，使用组件scroll-view可以在组件内任意滑动，但用户体验不好，使用新的api能获取元素高度给swiper，可以摆脱scroll-view
• 计数器 - input +　用input事件存值，blur事件取值
• wxss 不能引用本地文件

---

2017.12.28 2017年的小尾巴，重拾小程序，改变了好多啊，希望不要让我碰到小程序的bug，很要命！

• 编写组件样式时，需要注意以下几点：

  • 组件和引用组件的页面不能使用id选择器（#a）、属性选择器（[a]）和标签名选择器，请改用class选择器。
  • 组件和引用组件的页面中使用后代选择器（.a .b）在一些极端情况下会有非预期的表现，如遇，请避免使用。
  • 子元素选择器（.a>.b）只能用于 view 组件与其子节点之间，用于其他组件可能导致非预期的情况。
  • 继承样式，如 font 、 color ，会从组件外继承到组件内。
  • 除继承样式外， app.wxss 中的样式、组件所在页面的的样式对自定义组件无效。

讲了一堆总结起来其实就是1.用class 2.font、color还是会继承的 3.除了继承样式外，其他样式对自定义组件无效

微信小程序脚手架

• 父组件传值给子组件 :props.sync=foodata，要加上sync才是动态的（父变化，子就变化），不加的话字就不变化
• 组件通讯那里也是绝了....完全无语，但是看上去好像挺好用的...
• 在函数运行周期之外的函数里去修改数据需要手动调用$apply方法。如：

      setTimeout(() => {
            this.title = 'this is title';
            this.$apply();
      }, 3000);
  

---

2018.01.08 坑啊！我又来了~

1. 最近在做小程序，用wepy做，需要A页面中调用该页面引入的B组件的方法，需要用到$invoke，去了GitHub看别人的问题才发现是这样用的：
   

   

   很清晰的答案
   
   就是说，this.$invoke('这里写的是引入组件时，你命名的名称', '这里就是你在那个组件写在methods的方法', '这里就是你要传的值');官方文档在这方面写得不太清楚。

2. 跳转页面问题
   this.$navigate('./result'); // 文件的相对路径，可忽略扩展名
   如果是组件跳页，如下：
   

   

   来自Github的回答

3. 绑定事件需要传值并且用到时间对象是这样的：
   绑定：@tap="methods({{'参数'}})"
   注册：methods(arguments,event){ // 事件对象是放最后的}

4. 压缩上传，扫二维码在真机测试
   一开始输入这命令会有warning，警告你没有安装一堆插件，然后他自动帮你装，第二次输入npm run build 的时候还是这个警告，这时先把node_modules文件夹删除，重新运行npm install，然后再输入npm run build就行了。
   

   

   npm run build

5.把基础库变成1.9.X的时候，控制到一堆undefined
别人的情况
解决方法：

解决方法