antd table展开自定义标签

143 阅读1分钟
<a-table
    :expandIcon="customExpandIcon"
 />
 import { RightOutLined} from '@ant-design/icons-vue'
function customExpandIcon(props) {
    let style = {};
    if (props.expanded) {
      style =  {
        display: 'flex',
        justifyContent: 'center',
        alignItems: 'center',
        fontSize: '14px',
        cursor: 'pointer',
        color: '#999',
        transition: 'all 0.5s',
        transform: 'rotate(90deg)'
      };
    } else {
     style =  {
        display: 'flex',
        justifyContent: 'center',
        alignItems: 'center',
        fontSize: '14px',
        cursor: 'pointer',
        color: '#999',
        transition: 'all 0.5s',
        transform: 'rotate(0deg)'
      };
    }
    return h(RightOutLined, {

      onClick: function (e) {
        props.onExpand(props.record, e);
      },
      style,
    });
  },