console
var Main = {
data() {
return {
tableData: [{
name: '测试名称',
sex: '男',
date: '2019-08'
}, {
name: '测试名称2',
sex: '女',
date: '2019-08'
}, {
name: '测试名称3',
sex: '男',
date: '2019-08',
}, {
name: '张三',
sex: '男',
date: '2019-08',
}, {
name: 'test7',
sex: '女',
date: '2019-08'
}, {
name: 'test9',
sex: '男',
date: '2019-08'
}]
}
},
methods: {
reload() {
this.tableData = JSON.parse(JSON.stringify(this.tableData))
}
}
};
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')
<script src="https://unpkg.com/vue@2.6.14/dist/vue.min.js"></script>
<script src="//unpkg.com/element-ui@2.15.7/lib/index.js"></script>
<script src="//unpkg.com/xe-utils"></script>
<script src="https://unpkg.com/vxe-table@3.5.6/lib/index.umd.js"></script>
<link rel="stylesheet" href="https://unpkg.com/vxe-table@3.5.6/lib/index.css">
<link rel="stylesheet" href="//unpkg.com/element-ui@2.15.7/lib/theme-chalk/index.css">
<div id="app">
<el-button>按钮</el-button>
<div style="width: 1100px;height: 800px;">
<template>
<vxe-table
:data="tableData"
height="600"
show-overflow>
<vxe-table-column type="seq" width="68" fixed="left"></vxe-table-column>
<vxe-table-column field="name" title="Name" width="400"></vxe-table-column>
<vxe-table-column field="sex" title="Sex" width="800"></vxe-table-column>
<vxe-table-column field="date" title="Date" width="200" fixed="right"></vxe-table-column>
</vxe-table>
</template>
</div>
</div>