fes.js/packages/fes-doc/docs/ui/templates/table/13.md

---
layout: templateLayout
---
```vue
<template>
    <Wb-table :data="data">
        <template v-for="col in cols">
            <Column v-if="col.prop==='name'||col.prop==='age'" :key="col.prop" :index="col.index" :prop="col.prop" :name="col.name" />
            <Column v-else :key="col.prop" :prop="col.prop" :name="col.name" />
        </template>
    </Wb-table>
    <Wb-button type="primary" @click="toggle" style="margin-top:10px;">切换姓名列</Wb-button>
</template>
<script>
export default {
    data(){
        return {
            data: [{
                name: '张晓刚',
                age: 24,
                date: new Date(2016, 9, 10),
                adr: '北京市海淀区西二旗',
                status: 1
            }, {
                name: '李晓红',
                age: 26,
                date: new Date(2016, 9, 11),
                adr: '北京市海淀区西二旗',
                status: 2,
                _selected: true
            }, {
                name: '隔壁老王',
                age: 22,
                date: new Date(2016, 9, 12),
                adr: '北京市海淀区西二旗',
                status: 3
            }, {
                name: '我爸是李刚',
                age: 19,
                date: new Date(2016, 9, 13),
                adr: '北京市海淀区西二旗',
                status: 4
            }],
            cols: [{
                prop: 'name',
                name: '姓名',
                index: -1,
                show: true
            }, {
                prop: 'age',
                name: '年龄',
                show: true
            }, {
                prop: 'date',
                name: '日期',
                show: true
            }, {
                prop: 'adr',
                name: '地址',
                show: true
            }, {
                prop: 'status',
                name: '状态',
                show: true
            }]
        }
    },
    methods: {
        toggle() {
            if(this.lastShift){
                this.cols.unshift(this.lastShift);
                this.lastShift = null
            }else {
                this.lastShift = this.cols.shift();
            }
        },
    }
}
</script>
```