由于移动端用的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 + "×tamp=" + (new Date().getTime());
ui.request({
url:
url,
data: {},
method: "GET",
success: function (res) {
that.thisData = res.data;
},
fail: function (res) {
}
});
}
},
.
.
.
}
以上就是关键代码,如果遇到这个问题的人应该可以看懂吧,这里的想刷新的话直接通过调用 initDataUrl()就可以了