前端那些事20240201-前端那些事-avue2 表格列配置项-列拖拽排序

前端歌谣

于 2024-03-18 12:21:52 发布

阅读量334

点赞数 7

文章标签：前端

本文链接：https://blog.csdn.net/qq_41632427/article/details/135977503

版权

2024-vue2vue3-前端那些事专栏收录该内容

312 篇文章 1 订阅

订阅专栏

文章介绍了如何在使用Vue-CRUD组件时，通过Sortable.js实现数据列表的列内容排序，展示了如何配置列头和对应的prop属性。

摘要由CSDN通过智能技术生成

<script src="https://cdn.staticfile.org/Sortable/1.10.0-rc2/Sortable.min.js"></script>

<avue-crud :option="option" :data="data"></avue-crud>
<script>
export default {
  data(){
    return {
       data:[{
          text1:'内容1-1',
          text2:'内容1-2'
       },{
          text1:'内容2-1',
          text2:'内容2-2'
       },{
          text1:'内容3-1',
          text2:'内容3-2'
       }],
       option:{
          columnSort:true,
          column: [{
            label: '列内容1',
            prop: 'text1',
          }, {
            label: '列内容2',
            prop: 'text2',
          }]
       }
    }
  }
}
</script>