受欢迎的博客标签

微信小程序-函数定义的三种方法及使用

Published

微信小程序里的事件绑定,即方法定义,有三种情况。

情况1 

可以在当前xxx.js文件里直接定义,并使用,如下代码示例:

searchClick: function(even) {
    console.log(this.data.expressNumber)
 
    // 方法1 直接写请求方法
    if (this.data.expressNumber.length == 0)
    {
      wx.showToast({
        title: '请输入快递单号',
        image: '/images/icon/error.png',
      });
 
      return;
    }
 
    wx.showLoading({
      title: '请稍后',
    })
 
    wx.request({
      url: 'http://apis.baidu.com/kuaidicom/express_api/express_api?muti=0&order=desc&nu='+this.data.expressNumber,
      header: {
        'apikey': '2e24c33be1e7f7dafebc496c07441138'
      },
      success: function(res) {
        console.log("查找成功:");
        console.log(res);
        wx.hideLoading();
      },
      fail: function(res) {
        console.log("查找失败:");
        console.log(res);
        wx.hideLoading();
      }
    })
}

情况2

可以在app.js文件里定义,然后在被使用的文件中调用,如下代码示例:

在app.js中的定义

App({
 
  ......
 
  // 查询方法
  searchExpressInfo: function(expressNumber, callBack) {
    if (expressNumber.length == 0)
    {
      wx.showToast({
        title: '请输入快递单号',
        image: '/images/icon/error.png',
      });
 
      callBack(null);
      return;
    }
 
    wx.showLoading({
      title: '正在查找',
    });
 
    wx.request({
      url: 'http://apis.baidu.com/kuaidicom/express_api/express_api?muti=0&order=desc&nu=' + expressNumber,
      header: {
        'apikey': '2e24c33be1e7f7dafebc496c07441138'
      },
      success: function (res) {
        console.log("查找成功:");
        wx.hideLoading();
        // 回调
        callBack(res);
      },
      fail: function (res) {
        console.log("查找失败:");
        wx.hideLoading();
        // 回调
        callBack(res);
      }
    })
  }

在xxx.js中的使用,注意:使用app.js中定义的方法或属性时,必须先获取全局变量var app = getApp()

var app = getApp()
 
Page({
 
  .....
 
  searchClick: function(even) {
    console.log(this.data.expressNumber)
 
    // 方法2 调用在app.js中的封装方法
    app.searchExpressInfo(this.data.expressNumber, function(res){
      console.log(res);
    })
  }
})

情况3

在自定义的工具类文件中定义方法,然后在需要使用的文件中调用。如在util.js文件中定义,然后在xxx.js中使用。注意:在util.js中定义的方法,需要通过module.exports={xxxMethord: xxxMethord}公开暴露出来,否则被调用时识别不出来会出现;同时,在xxx.js文件中使用时,需要通过require("路径/util.js")导入util.js文件,再进行调用。

在util.js中的定义

module.exports = {
  formatTime: formatTime,
  request: request
}
 
// 请求方法
function request(url, header, params, callBack) {
 
  wx.showLoading({
    title: '请稍后',
  })
 
  wx.request({
    url: url,
    header: header,
    success: function(res) {
      wx.hideLoading();
      callBack(res);
    },
    fail: function(res) {
      wx.hideLoading();
      callBack(res);
    }
  })
}

在xxx.js中的使用

var util = require("../../utils/util.js")
 
Page({
 
  ......
 
  searchClick: function(even) {
    console.log(this.data.expressNumber)
 
    // 方法3 调用在util.js中的封装方法
    if (this.data.expressNumber.length == 0) {
      wx.showToast({
        title: '请输入快递单号',
        image: '/images/icon/error.png',
      });
 
      return;
    }
    var url = 'http://apis.baidu.com/kuaidicom/express_api/express_api?muti=0&order=desc&nu=' + this.data.expressNumber;
    var header = {'apikey': '2e24c33be1e7f7dafebc496c07441138'};
    var params = null;
    util.request(url, header, params, function(res){
      console.log(res);
    })
  }
}

 

 

微信小程序开发——函数方法定义

https://blog.csdn.net/potato512/article/details/79898796

微信小程序使用函数的三种方法

https://blog.csdn.net/weixin_37557729/article/details/107012270