微信小程序实用小技巧

CSS:

实现渐变色

第一个是起点颜色，慢慢过渡到第二个颜色
从上到下的线性渐变：
background: linear-gradient(red, blue);
从左到右的线性渐变：
background: linear-gradient(to right, red , blue);

渐变色.png

裁圆角

设置弧度 顺序是 左上角  右上角  右下角  左下角 （顺时针）
border-radius: 3px 0px 0px 3px;

JS:

调用电话

//拨打手机
  calling:function(event){
    console.log('拨打手机')
  console.log(event)
  var that = this;
    wx.makePhoneCall({
      phoneNumber:that.data.phone, //此号码并非真实电话号码，仅用于测试
      success:function(){
        console.log("拨打电话成功！")
      },
      fail:function(){
        console.log("拨打电话失败！")
      }
    })
  },

下拉刷新，上拉加载更多

1）首先在要刷新类的.json文件里添加

{
   "enablePullDownRefresh": true
}

2）然后在js里实现"onPullDownRefresh"和"onReachBottom"方法即可

下拉事件
onPullDownRefresh: function() {
       console.log('刷新'); 
}, 
上拉事件
onReachBottom: function() { 
       console.log(' 下一页'); 
},

注意：刷新可能会和scroll-view控件冲突