vue版本:2.6.10 xe-utils:2.6
html:
border
height="300"
show-header-overflow="tooltip"
show-overflow="tooltip"
highlight-hover-row
:resizable="true"
:loading="loading"
:pager-config="tablePage"
:data="tableData">
查看
js:
data() {
return {
tableData: [],
loading: false,
tablePage: {
total: 110,
currentPage: 1,
pageSize: 10,
align: 'center',
pageSizes: [10, 20, 50, 100, 200, 500],
perfect: true
}
}
},
created() {
this.getListData2()
},
methods: {
getListData2 () {
this.loading = true
getListData().then(res => {
this.tableData = res.result
console.log(res.total);
// this.tablePage.total = res.total
// console.log(res)
this.loading = false
})
}
}
main.js:
import 'xe-utils'
import VXETable from 'vxe-table'
import 'vxe-table/lib/index.css'
Vue.use(VXETable)
JSON:
`{
code: 200,
total: 11,
result: [
{name: '张东方闪电三', sex: '男', age: 20},
{name: '李大范甘迪四', sex: '男', age: 21},
{name: '王五', sex: '女', age: 22},
{name: '王五', sex: '女', age: 22},
{name: '王五', sex: '女', age: 22},
{name: '王五', sex: '女', age: 22},
{name: '王五', sex: '女', age: 22},
{name: '王五', sex: '女', age: 22},
{name: '王五', sex: '女', age: 22},
{name: '王五', sex: '女', age: 22}
]
}`
在线例子:[http://jsrun.net/SQvKp/edit](http://jsrun.net/SQvKp/edit)