关于使用wetouch的ui-table标签不能通过 设置start-refresh为true实现table的立即刷新的一种解决方法

本文介绍在Wetouch框架中使用ui-table组件实现实时刷新List的方法。通过直接调用接口更新数据并利用ui:model绑定,解决start-refresh属性无法实时刷新的问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

由于移动端用的wetouch框架来开发,这里要做一个需要实时刷新的list展示,并且又不想用table标签来做,所以在开发文档中找到
wetouch组件:ui-table

但是这里遇到了一个刷新的问题 即设置start-refresh为true实现table的立即刷新,用文档里提供的这个方法始终不能实现随时刷新,

后来不得已 直接不用ui-table里的自带的url属性 而是通过ui.request({})直接调用接口将值查出来塞入ui-table标签中的 ui:model="thisData"中关键代码如下

 <ui-view>
      <ui-table header="{{thisHeader}}" ui:model="thisData" alternating-row="true" is-login="true" sticky="true" tap-effect></ui-table>
    </ui-view>
 data() {
    return {
      webapiContext: ui.getApp().globalData.webapiContext,
      user: ui.getStorageSync('userinfo'),
      uid: "",
      url: '',
      search: "",
      thisHeader: [{
        name: 'stockname',
        display: '名称',
        align: "center",
        headerAlign: "center",
      }, {
        name: 'stockcode',
        display: '代码',
        align: "center",
        headerAlign: "center",
      }, {
        name: 'currentprice',
        display: '最新价',
        align: "center",
        headerAlign: "center",
        render: (h, params) => {
          let currentprice = this.thisData.rows[params].currentprice;
          if (currentprice == null) {
            currentprice = 0;
          }
          return h("div", {}, [
            h("span", {
              style: {
                color: "#e60012"
              }
            }, currentprice.toFixed(2))
          ]
          );
        }
      }, {
        name: 'gain',
        display: '涨幅',
        align: "center",
        headerAlign: "center",
        render: (h, params) => {
          let gain = this.thisData.rows[params].gain;
          if (gain == null) {
            gain = 0;
          }
          let color;
          if (gain >= 10) {
            color = '#E31515';
          } else {
            color = '#028912';
          }
          return h("div", {}, [
            h("span", {
              style: {
                background: color,
                color: "#fff",
              }
            }, gain.toFixed(2))
          ]
          );
        }
      }, {
        name: 'operate',
        display: '操作',
        align: "center",
        headerAlign: "center",
        render: (h, params) => {
          var that = this;
          return h('div', {}, [
            h('span', {
              style: {
                color: '#F80408',
                margin: '5px',
              },
              on: {
                click: function (e) {
                  let stockname = that.thisData.rows[params].stockname;
                  let stockcode = that.thisData.rows[params].stockcode;
                  that.skipToStrategy(stockname, stockcode);
                }
              }
            }, '买入'),
            h('span', {}, '|'),
            h('span', {
              style: {
                color: '#220BF2',
                margin: '5px',
              },
              on: {
                click: function (e) {
                  let stockname = that.thisData.rows[params].stockname;
                  let stockcode = that.thisData.rows[params].stockcode;
                  that.removeData(stockname, stockcode);
                }
              }
            }, '移除'),
          ])
        }
      }],
      
      thisData: {},//这里是给表赋值的data
     
      pageLoad: {
        trigger: 'always',
        handle: () => {
          var that = this
          ui.getApp().reloadUserInfo(function (userInfo) {
            that.user = userInfo;

            that.initDataUrl();//加载页面即刷新list数据
          });
        }
      }
    }
  },
methods: {
    initDataUrl() {
      var that = this;
      if (that.user != null) {
        that.uid = that.user.data.id;
        var url = that.webapiContext + "/xnn/client/stocksMychoice/getAllMychoice.json?uid=" + that.uid + "&timestamp=" + (new Date().getTime());
        ui.request({
          url:
            url,
          data: {},
          method: "GET",
          success: function (res) {
            that.thisData = res.data;
          },
          fail: function (res) {
          }
        });
      }
    },
.
.
.
}

以上就是关键代码,如果遇到这个问题的人应该可以看懂吧,这里的想刷新的话直接通过调用 initDataUrl()就可以了

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值