Ele table dynamic column

want to implement a function of dragging and dynamically changing columns

now that drag and drop is implemented in draggable, the array of header columns will change as you drag.
but the phenomenon is that the columns of table do not change with each other

table header code is as follows:

Draggable element-ui vue.js

Mar.20,2021

< template >

<div>
    <el-table
            :data="tableData"
            stripe
            style="width: 100%">
        <el-table-column
                prop="date"
                label=""
                width="180">
        </el-table-column>

        <el-table-column :key='fruit' v-for='fruit in formThead' :label="fruit" >
            <template slot-scope="scope">
                {{scope.row[fruit]}}
            </template>
        </el-table-column>


    </el-table>

    <el-button @click="test" type="primary" size="small"
               style="margin-top: 10px;margin-bottom: 5px">
        <i style="margin-right: 5px" class="el-icon-circle-plus-outline"></i>
    </el-button>

</div>

< / template >

< script >

export default {
    data() {
        return {
            formThead :['date','name','address'],
            tableData: [{
                date: '2016-05-02',
                name: '',
                address: ' 1518 '
            }, {
                date: '2016-05-04',
                name: '',
                address: ' 1517 '
            }, {
                date: '2016-05-01',
                name: '',
                address: ' 1519 '
            }, {
                date: '2016-05-03',
                name: '',
                address: ' 1516 '
            }]
        }
    },
    methods:{
        test(){
            this.formThead =  ['name','date','address'];
        },
    }
}

< / script >
narrow the range and find that the change in the order of formThead data does not start table redrawing. Why

Previous: The JS code problem is solved by the following code

Next: Why doesn't laravel php artisan list have commands like make:controller?