微信小程序开发中的相关记录

只有当前开发者可以真机预览

命名规范

• 样式类名：text-xs（-分割）【weui-cell__radio-selected】
• 图片：list_cur.png（用_分割）
• 变量名、函数名：小驼峰命名法
• 文件名：-分割

页面配置

• backgroundColor 为窗体下拉刷新或上拉加载时露出的背景（在电脑模拟器中无法看到。或者设置enablePullDownRefresh为true）
• backgroundTextStyle 加载动画的三个点的颜色（设置enablePullDownRefresh为true）
• backgroundColorTop、backgroundColorBottom分别设置上下两部分的窗口背景颜色，覆盖backgroundColor
• onReachBottomDistance页面上拉触底事件触发时距页面底部距离。结合onReachBottom(){}一起使用，并保证页面高度大于可视高度，即出现滚动条
• singlePage——onShareTimeline()分享朋友圈仅在安卓手机有效
• restartStrategy 通过滑掉小程序、扫码重进来进行冷启动（仅安卓有小程序单独窗口可滑），即使微信有加载动画也不影响，任意在进入子页面的tabbar页面或子页面添加此属性均有效果

APP

• 在跳转链接中添加参数能为页面传入query（对象需通过与json的转换传入）

  wx.navigateTo({
  	url: '../logs/logs?id=123&name='123''
  })
  

  通过onLoad(query)获取，
  js文件中'./register2?uAccount=' + uAccount + '&uPwd=' + uPwd（注意不能有空格）
• onError可用this.setData122等进行触发
• onPageNotFound可用不存在的页面进行触发

  wx.redirectTo({
       url: '../logs1/logs1'
   })
  

• onPageNotFound通过自定义编译进行触发
  • wx.redirectTo、wx.navigateTo均不能触发
    

实践记录

• bindtap只用于写明函数名，无法直接传参

  • 通过data-xxxx="{{1234}}"、e.currentTarget.dataset.xxxx进行获取

• 被遮挡有可能是设置了overflow: hide

• .cu-form-group+.cu-form-group 两个连续使用，后者会使用的样式

• 使用transform:scale(0.7)可对radio圈圈进行大小修改

• input高度设置，避免文字被margin、padding挤压：height设置

• wx-charts使用到组件中的方法：wxCharts柱状图图表在component页面中不显示 为啥？（其中onLoad: function (e) {}中内容放至ready() {}中）

• form设置bindsubmit，表单中input等设置name，e.detail.value——可直接获取表单内容，无需给每个input等设置bindinput获取e.detail.value

• app.json中设置"debug": true与扫码后手机上的控制面板无关，直接右上角手动打开即可

• set = 'abc['+index+'].status
  [set]
  
  [`testArr[${index}].id`]:index
  
  `author ${this.not_navi ? 'bold' : ''}`（vue）
  

•  let gameTimer = setTimeout(() => {
        console.log("3s后,setTimeout触发了")
  }, 3000)
  
  clearTimeout(gameTimer)			// 不能这样写，会无法执行
  

  定时器使内部代码延迟执行，所以写在定时器后面的代码会在内部代码执行前执行，正确做法是写在内部：

  let total_micro_second = 6000
  
  function count_down(that) {
    that.setData({
      clock: date_format(total_micro_second)
    })
    let micro_timer = setInterval(() => {
      console.log('1',total_micro_second);
      total_micro_second -= 1000
      console.log('2',total_micro_second);
      that.setData({
        clock: date_format(total_micro_second)
      })
      // console.log(total_micro_second,date_format(total_micro_second));
      // if (total_micro_second <= 0) {
      //   console.log('clear');
      //   clearInterval(micro_timer)
      //   return
      // }
    }, 1000)
    setTimeout(() => {
      clearInterval(micro_timer);
    }, total_micro_second)
  }
  

  let micro_timer定义在function内部时成功停止
  wx.request后代码可能先执行

• 方法的特殊使用

  var taskNum = this.createTaskNum()
  taskNum.categories
  
  methods: {
  createTaskNum() {
        var categories = []
        var data = []
        for (var i = 0; i < 30; i++) {
          categories.push('12-' + (i + 1))
          data.push(Math.random()*(20-10)+10)
        }
        // data[4] = null
        return {
          categories: categories,
          data: data
        }
      }
  }
  

• url="./register2?uAccount={{uAccount}}&uPwd={{uPwd}}"
  url: './register2?uaccount=' + uaccount + '&upwd=' + upwd