vue-easytable问题笔记

文章参考

  1. vue-easytable
  2. 排序
  3. 安装
  4. 拖拽

无法访问vue-easytable的API页面

之前收藏了vue-easytable的API页面,方便时刻查阅,前几次还好,后面发现推荐给同事和自己打开的时候,就出现了无法访问,开始以为是网络问题或者是服务器挂了,后面发现,只要通过github链接过去就可以了

排序的问题

根据文档,只需要添加multiple-sort属性即可,但是页面还是无法出现相关的图标,最后跟官网的demo每个字段做相关的对比,原来是我的cloumn的值要在对应的字段中添加orderBy:'asc'属性

export default{
  name: 'sort-by-multiple-columns',
  data(){
    return {
      tableData: [
          {"name":"赵伟","tel":"156*****1987","hobby":"钢琴、书法、唱歌","address":"上海市黄浦区金陵东路569号17楼"}
      ],
      columns: [
          {field: 'name', title: '姓名', width: 80, titleAlign: 'center',columnAlign:'center',orderBy:'asc',isResize:true}
    }
  },
  methods: {
  }
}

拖拽的问题

根据文档的要求,我只需要添加 column-width-drag 这个组件就可以了,发现不管怎么使用,都无法拖拽。最后找同事帮忙解决了,原来是因为我设置了不显示表格的border;即 :show-vertical-border='true'即可

<v-table :columns='columns' :table-data='tableData'
  :show-vertical-border='true'
  column-width-drag
></v-table>

猜你喜欢

转载自blog.csdn.net/hbiao68/article/details/83783527