Files
vxe-table/examples/views/table/scroll/ScrollFixed.vue
xuliangzhan 0f493bfaed update
2019-05-02 17:05:16 +08:00

57 lines
2.4 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<div>
<p>加载 {{ $route.params.size }} 左右固定列</p>
<vxe-table
ref="vTable"
border
resizable
height="600"
:loading="loading">
<vxe-table-column type="index" width="100" fixed="left"></vxe-table-column>
<vxe-table-column prop="name" label="Name" sortable width="200"></vxe-table-column>
<vxe-table-column prop="age" label="Age" width="200"></vxe-table-column>
<vxe-table-column prop="sex" label="Sex" width="200"></vxe-table-column>
<vxe-table-column prop="date" label="Date" width="200"></vxe-table-column>
<vxe-table-column prop="rate" label="Rate" width="200"></vxe-table-column>
<vxe-table-column prop="region" label="Region" width="200"></vxe-table-column>
<vxe-table-column prop="time" label="Time" width="200"></vxe-table-column>
<vxe-table-column prop="address" label="Address" width="300" show-overflow-tooltip></vxe-table-column>
<vxe-table-column prop="updateTime" label="UpdateTime" width="200"></vxe-table-column>
<vxe-table-column prop="createTime" label="CreateTime" width="200"></vxe-table-column>
<vxe-table-column prop="attr1" label="Attr1" width="200"></vxe-table-column>
<vxe-table-column prop="attr2" label="Attr2" width="200"></vxe-table-column>
<vxe-table-column prop="attr3" label="Attr3" width="200"></vxe-table-column>
<vxe-table-column prop="attr4" label="Attr4" width="200"></vxe-table-column>
<vxe-table-column prop="attr5" label="Attr5" width="200"></vxe-table-column>
<vxe-table-column prop="attr6" label="Attr6" width="200"></vxe-table-column>
<vxe-table-column prop="attr7" label="Attr7" width="200"></vxe-table-column>
<vxe-table-column prop="attr8" label="Attr8" width="200"></vxe-table-column>
<vxe-table-column prop="attr9" label="Attr9" width="200"></vxe-table-column>
<vxe-table-column prop="createTime" label="CreateTime" width="200" fixed="right"></vxe-table-column>
</vxe-table>
</div>
</template>
<script>
export default {
data () {
return {
loading: false
}
},
created () {
this.loading = true
this.$nextTick(() => {
this.$refs.vTable.reload([])
setTimeout(() => {
let size = this.$route.params.size
let list = window.CACHE_DATA_LIST.slice(0, size)
this.$refs.vTable.reload(list)
this.loading = false
}, 500)
})
}
}
</script>