美文网首页
ant-design-vue Table组件自定义行样式

ant-design-vue Table组件自定义行样式

作者: Indomi | 来源:发表于2019-10-12 17:45 被阅读0次

    近期遇到了一个需求对于不同行的表格数据需要不同的样式,通过查询文档有两种实现的想法

    • 方法1:通过设置a-tablecustomRow,返回style
    • 方法2:通过设置a-tablerowClassName,对于不同的数据判断返回相应的class

    方法2可以实现相关的功能没错,但是方法1文档提供的customRow返回的对象描述就比较模糊了

    customRow用法
    • 需要改变样式的话只能猜想修改props里的内容,试了一下并没有用,于是看一下源码
      customRow
    • 这里是定义了customRow的话就运行得到返回的对象,再调用工具方法与原先的props进行一个合并,原先的props包括一个class的前缀,vuex存的store数据,和table本身的rowKey属性

    其实看到这里还是没有看懂props可以提供修改的属性到底是有哪些,原先猜想的是html标签的属性并不成立

    原版antd的onRow
    • 通过查看antd的(鼻祖)React版本的话,它提供的是一个onRow方法,返回只有对应的事件,并没有props

    感觉这个props并没有用

    相关文章

      网友评论

          本文标题:ant-design-vue Table组件自定义行样式

          本文链接:https://www.haomeiwen.com/subject/shxcmctx.html