vue s-table与loadData使用
一.loadData1.loadData从后台加载数据loadData: parameter => {Object.assign(this.queryParam, parameter)return getVersionList(this.queryParam).then(resp => {return resp.data})},//Object.assign(this.queryPar
·
一.loadData
1.loadData从后台加载数据
loadData: parameter => {
Object.assign(this.queryParam, parameter)
return getVersionList(this.queryParam).then(resp => {
return resp.data
})
},
//Object.assign(this.queryParam, parameter)注意此函数用法
2.loadData加载从上个页面携带过来的数据
tableData:[],
loadData: parameter => {
return new Promise(resolve => {
resolve(this.tableData)
}).then(res => {
return {records:res}
//return res
})
}
// 用tableData在show()中接到上个页面传递过来的数据
s-table
<s-table
rowKey="id"
:columns="columns"
:data="loadData"
class="cbcs-table cbcs-table-ellipsis"
size="middle"
>
</s-table>
// 主要注意customRender用法
columns: [
{
title: '序号',
dataIndex: 'taxis',
align: 'center',
width: 60,
customRender: function (text, record, index) {
return (index + 1)
}
},
{
title: '版本号',
dataIndex: 'version',
align: 'center',
width: 110
},
//调用函数
{
title: '违规时间',
dataIndex: 'createTime',
align: 'center',
width: 100,
customRender: (text) => this.$util.date.formatNumber(text, 'YYYY-MM-DD', false)
},
{
title: '违规影响期',
dataIndex: 'startTimeInt',
align: 'center',
width: 200,
customRender: (text,record) => record.startTime +"-"+record.endTime
},
//点击事件
{
title: '详情',
dataIndex: 'action',
width: 80,
align: 'center',
fixed: 'right',
scopedSlots: { customRender: 'action' }
},
// 页面上接收
<a
slot="action"
slot-scope="text, record"
href="javascript:void(0);"
@click="preview(record)">详情</a>
//调用函数,做更加详细的操作
{
title: '说明',
dataIndex: 'detail',
customRender:(text,record)=>this.translateDetail(text,record)
}
],
//methods中定义函数translateDetail(text,record),做进一步操作
translateDetail(text,record){
switch (record.problemType) {
case "entry":
//this.$options.filters['NumToUnitNum']在方法中调用的main.js中的过滤器NumToUnitNum
text="中标项目"+record.bidName+",中标价格"+this.$options.filters['NumToUnitNum'](record.bidderBudgetMoney)+this.$options.filters['GetUnit'](record.bidderBudgetMoney)+",成交价为预算价的"+((record.bidderBudgetMoney/record.budgetMoney)*100).toFixed(2)+"%";
break;
...
}
return text;
}
更多推荐
已为社区贡献2条内容
所有评论(0)