Vue-TableVue是一个基于Vue.js的表格组件，它提供了丰富的功能，包括列宽、列顺序等。要实现可修改table列宽度和列顺序，可以通过以下步骤：

1. 在Vue项目中安装Vue-TableVue：

npm install vue-tablevue --save

2. 在main.js文件中引入Vue-TableVue并注册为全局组件：

import Vue from 'vue'

import VueTables from 'vue-tables'

import 'vue-tables/dist/vue-tables.css'



Vue.use(VueTables)

3. 在需要使用Vue-TableVue的组件中，通过``标签引入Vue-TableVue：

4. 在组件的`script`标签中定义`columns`和`tableData`属性：

export default {

  data() {

    return {

      columns: [

        {

          title: '姓名',

          field: 'name',

          sortable: true,

          searchable: true,

          filterable: true,

          customRender: (row, column, cell, rowIndex, colIndex) => {

            return `${row.name} - ${cell.text}`

          }

        },

        {

          title: '年龄',

          field: 'age',

          sortable: true,

          searchable: true,

          filterable: true,

          customRender: (row, column, cell, rowIndex, colIndex) => {

            return `${row.age}岁`

          }

        },

        {

          title: '性别',

          field: 'gender',

          sortable: true,

          searchable: true,

          filterable: true,

          customRender: (row, column, cell, rowIndex, colIndex) => {

            return `${row.gender === 'male' ? '男' : '女'}`

          }

        },

      ],

      tableData: [

        // 示例数据

        { name: '张三', age: 25, gender: 'male' },

        { name: '李四', age: 30, gender: 'female' },

        { name: '王五', age: 28, gender: 'male' },

      ]

    }

  }

}

5. 在组件的`mounted`生命周期钩子中，可以调用`this.$refs.table.updateColumns`方法来更新列宽和列顺序：

mounted() {

  this.$refs.table.updateColumns({ width: 100, order: ['age', 'name'] })

}

这样，你就可以根据需要调整列宽和列顺序了。vue2.0实现的可修改table列宽度和列顺序