微信小程序 picker选择器 从后台拿值 (优化版)

最近毕业设计强行加了一个微信小程序…

记录一下关于“picker”的用法。

从后台拿到的数据是这样滴:
微信小程序 picker选择器 从后台拿值 (优化版)_第1张图片

我需要实现的效果:
微信小程序 picker选择器 从后台拿值 (优化版)_第2张图片

主要实现代码:
js文件:

 getCreditlistData:function(url){
    var _this = this;
    wx.request({
      url: url,
      method: 'POST',
      header: {
        "Content-Type": "json"
      },
      success: function (res) {
        _this.setData({
         credit_array:res.data.result,
        })
      },
      fail: function (error) {
        console.log(error);
      }
    })
  },
  getGroupListData: function (url) {
    var _this = this;
    wx.request({
      url: url,
      method: 'POST',
      header: {
        "Content-Type": "json"
      },
      success: function (res) {
        console.log(res);
        _this.setData({
          group_array: res.data.result,
        })
      },
      fail: function (error) {
        console.log(error);
      }
    })
  }

这看着是不是有点多~?而且代码基本上重复 滴,那么我们来优化一下。
js文件:


 data: {
    credit_array:[],
    group_array:[],
  },
  
  onLoad: function (event) {
    var creditlistUrl =“”;
    var grouplistUrl = “”;

    this.getlistData(creditlistUrl,"credit_array");
    this.getlistData(grouplistUrl,"group_array");
  },
  
   getlistData: function (url, settedKey) {
    var _this = this;
    wx.request({
      url: url,
      method: 'POST',
      header: {
        "Content-Type": "json"
      },
      success: function (res) {
        var readyData = {};
        readyData[settedKey] = res.data.result,
        
         _this.setData(
            // credit_array:res.data.result,
            readyData
          )
      },
      fail: function (error) {
        console.log(error);
      }
    })
  }

wxml文件:
具体属性参数,就不具体介绍了。详情自己看看微信小程序的文档~

  
    
      {{group_array[group_index].name}}
    
  

你可能感兴趣的:(微信小程序)