前端那些事20240119-前端那些事-avue表格列配置项默认排序_前端

<avue-crud :data="data" :option="option1" @sort-change="sortChange"></avue-crud>

<script>
export default {
    data() {
      return {
        data: [
          {
            name:'张三',
            sex:'男'
          }, {
            name:'李四',
            sex:'女'
          }
        ],
        option1:{
          defaultSort:{
            prop: 'name',
            order: 'descending'
          },
          border:true,
          column:[
             {
              sortable:true,
              label:'姓名',
              prop:'name'
            }, {
              label:'性别',
              prop:'sex'
            }
          ]
        }
      };
    },
    methods: {
       sortChange(val){
        this.$message.success(JSON.stringify(val));
      }
    }
}
</script>

运行结果

前端那些事20240119-前端那些事-avue表格列配置项默认排序_状态模式_02