iView-UI：Poptip中渲染多行i-table时弹出位置出错

问题

使用iViewUI的Poptip时，在Poptip内渲染超过两行的i-table时，会出现迷之错误：采用hover方式唤起Poptip时，鼠标第一次移上去时Poptip的弹出位置会出现较大偏移，第二次移上去的时候就好了。至今不知道Bug在哪

解决方案

用HTML的table标签手动生成所需要的表格

// myPoptip
<template>
  <Poptip trigger='hover' :placement="placement" :transfer="true" width="600">
    <p>hover以激活Potip</p>
    <div slot='content' style="max-height: 800px; overflow:auto;">
      <table v-html="detail" cellspacing="0" style="width: 100%; text-align: center; border: 1px solid rgb(220,222,226); border-collapse:collapse;"></table>
    </div>
  </Poptip>
</template>

<script>

export default {
  name: 'sample',
  data () {
    return {
      detail: ''
    }
  },

  props: {
    rowData: {
      type: Object,
      default () {
        return {}
      }
    },

    placement: {
      type: String,
      default () {
        return 'bottom'
      }
    }
  },

  methods: {
    genTableRow (type, content, style, other = null) {
      return `
        <tr>
        ${content.map(item => `${`<${type} ${other || ''} ${style ? `style="border: 1px solid rgb(220,222,226); ${style}"` : ''}>`}${item}</${type}>`).join('')}
        </tr>
      `
    }
  },

  mounted () {
    this.detail = this.genTableRow('th', ['title1', 'title2'], 'padding: 10px 0;')
    if (this.rowData.tableCount === 0) {
      this.detail += this.genTableRow('td', ['暂无数据'], 'padding: 10px 0;', 'colspan="2"')
    } else {
      for (let item of this.rowData.tableContents) {
        this.detail += this.genTableRow('td', [item.content1, item.content2], 'padding: 10px 0;')
      }
    }
  }
}
</script>

// render节选
<template>
  <div class="detail">
    <i-table border :data="rowData" :columns="columns"/>
  </div>
</template>
<script>
import detailPoptip from './myPoptip'
export default {
  name: 'sample',

  mounted () {
    let data = {a: 1, b: [{content1: 2, content2: 2}]}
    this.rowData = [data]
    this.columns.push({
      title: 'a',
      align: 'center',
      key: 'a',
      render: (h, params) => {
        return h(detailPoptip, {
          props: {
            rowData: {
              tableCount: data.a,
              tableContents: data.b
            },
            placement: 'left'
          }
        })
      }
    })
    }
  },

  data () {
    return {
      rowData: [],
      columns: []
    }
  }
}
</script>