前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >小程序数据渲染根据返回值计算百分比并且显示

小程序数据渲染根据返回值计算百分比并且显示

原创
作者头像
王小婷
修改2020-10-23 10:16:18
8650
修改2020-10-23 10:16:18
举报
文章被收录于专栏:编程微刊

wxml:

代码语言:javascript
复制
 <view >{{ precent + '%'}}</view>
 <text >{{welfare_list.welfareDO.haveForestCoin}}/{{welfare_list.welfareDO.forestCoin}}森林币</text>

js

代码语言:javascript
复制
Page({
  data: {
    welfare_list: [],
    welfareDO: {},
  },
  onLoad() {
    this.getWelfareList()
  },
  getWelfareList() {
    let that = this;
  
    wx.request({
      url: 'http://www.xxxxx.com/1.json',
      header: {
        'content-type': 'application/json',
      },
      success: res => {
        that.setData({
          welfare_list: res.data.data,
          welfareDO: res.data.data.welfareDO,
          precent: Math.round(res.data.data.welfareDO.haveForestCoin * 100 / res.data.data.welfareDO.forestCoin),
          
        })
      },
      fail: err => {
      }
    })
  },
});

json

代码语言:javascript
复制
{
    "msg": "操作成功",
    "code": "0000",
    "data": {
        "welfareDO": {
            "forestCoin": 10,
            "haveForestCoin": 7
        }
    }
}

显示:

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档