小程序模板网

微信小程序之小技能篇(一)

1,三目运算改变class值:

<view class="{{flag ? 'change' : 'change_after'}}">改变字体颜色</view>  //flage为true/false时,选择class名

应用场景:需要动态改变元素样式。比如:点击某按钮,改变字体颜色。

2,利用缓存实现:点击按钮,数字减一


//XML页面:
<text style='font-size:26rpx; color:#ff0000'>{{counts}}</text>

//JS页面:
 onLoad: function (options) {
    var counts = wx.getStorageSync('key')  //获取缓存值
    this.data.currentcounts = counts  //***把counts赋值给data的属性currentcounts
    if (counts) { //判断是否存在缓存值
      this.setData({  //存在的话,将值绑定到counts
        counts: counts
      })
    } else {
      wx.setStorageSync('key', 9)  //不存在的话,设置缓存值。(为方便测试,这里设置为9)
    }
    // console.log(counts);
  },


  self_redution: function (event) {  //自定义方法
    var a = wx.getStorageSync('key')  //取得缓存值
    if (a > 0) { 
      var b = a - 1  //大于0,那么自身值减一
    } else {
      var b = this.data.currentcounts //***否则,缓存值为上面设置的值
    }
    console.log(b);
    a = wx.setStorageSync('key', b)
    this.setData({
      counts: b,  //将缓存值绑定到counts
    })


   formSubmit: function (event) {

      this.self_redution() //调用上面自定义方法

   },

 

 

应用场景:报名时,每次表单提交成功时,剩余可报名人数减掉一人。

上面有一个知识点:如何将onload中获取的值传递到点击事件中?这里采取一个通过data:{}中转的办法:把counts赋值给data的属性currentcounts

 

3,定义一个方法,如何在点击事件中调用

 

------------------------

问题:

今早过来接着优化表单提交【就是每次提交之后,将写入缓存的数值减一】,调试的时候频繁测试代码是否能成功执行,所以会有好多次的表单提交。
试着试着,突然浏览器报错,同时也收不到邮件....  然后我点预览在手机上看效果,结果也报错...   

微信小程序预览报错:

浏览器报错:

处理:在网上搜到的应该是代理设置上的问题 ,关闭代理。

 工具栏 -“设置”-“代理设置”,选择“不使用任何代理,勾选后直连网络”。

取消代理后,不再报错回复正常。很奇怪,之前还一直好好的,就算是默认代理也没有问题,最有可能就是我频繁提交表单了....

 



易优小程序(企业版)+灵活api+前后代码开源 码云仓库:starfork
本文地址:https://www.eyoucms.com/wxmini/doc/course/24258.html 复制链接 如需定制请联系易优客服咨询:800182392 点击咨询
QQ在线咨询