微信小程序汇率计算界面

微信小程序汇率计算界面

最近在学习微信小程序，自己制作了一个自己想制作的小应用——汇率计算界面（真不知道为什么自己对汇率那么感兴趣XD ）

数据接入
在获取数据之前先在data里面添加几个参数

moneyType: ['人民币￥','港币$', '美金$', '英镑￡', '欧元€','日元￥'],
moneyType1: ['人民币￥','港币$', '美金$', '英镑￡', '欧元€', '日元￥'],//兑换选项
moneyAfter: 0,//计算完后的数值
currentSelect1: 0,//第一个选项框选择
currentSelect2: 0,//第二个选项框选择
currentSelect3: 0,//第三个选项框选择
input: 0

~

由于需要实时的数据，使用了api接口获取汇率数据，由于接口使用次数有限（有钱的可以忽略），原本决定在每次打开这个界面的时候就获取一次数据（即onShow函数），后改为只在用户第一次打开这个界面时获取数据（即onLoad函数）。

onLoad: function (options) {
   
    var _this = this //在后面的success函数中避免冲突
    wx.request({
   
      url: 'https://sapi.k780.com',
      data: {
   //在访问接口时所需要的参数
        app: 'finance.rate',
        appkey: '',//网站提供
        sign: '',//网站提供
        scur: 'CNY,CNY,CNY,CNY,CNY',
        tcur: 'HKD,USD,GBP,EUR,JPY',//兑换货币的简称
        format: 'json'//返回json数据
      },
      dataType: 'json',
      type: 'get',
      header: {
   
        'content-type': 'application/json' // 默认值
      },
      success(res) {
   
        console.log(res.data.result.lists)
        _this.setData({
   
          list: res.data.result.lists,/
        })
        _this.setData({
   //初始界面的参数
          cny: 100,
          hkd: (_thi