iveiw table 渲染表头

一、表头加提示

将表头columns.map
            item.renderHeader = h => {
    
    
              return h(
                'Tooltip',
                {
    
    
                  props: {
    
    
                    placement: 'top',
                    theme: 'light',
                    transfer: true,
                    maxWidth: 300,
                    content:
                      '注意：提示内容',
                  },
                },
                [
                  h(
                    'div',
                    {
    
    
                      style: {
    
    
                        cursor: 'pointer',
                        height: '100%',
                        width: '100%',
                        display: 'flex',
                        'align-items': 'center',
                        'justify-content': 'center',
                      },
                    },
                    [item.title, h('span', {
    
     class: 'tip-img' })]
                  ),
                ]
              );
            };

  /deep/ .ivu-table-cell {
    
    
    .tip-img {
    
    
      display: inline-block;
      vertical-align: top;
      margin-left: 6px;
      width: 15px;
      height: 15px;
      background: url('../../../assets/images/passenger-flow/tip.png') no-repeat;
      background-size: contain;
    }
    .tip {
    
    
      white-space: normal;
    }
  }

效果图如下：

二、排序