ant design vue的tooltip的宽度修改不生效

今天在tooltip中加入table然后尝试修改宽度一直不生效，真的焦灼万分，在标签上用自带的属性不行，直接加style不行，加类写样式不行，样式穿透给底层组件样式也不生效。最后才发现加的位置不对。

image.png

在调试页面修改.ant-tooltip的属性一直不生效，最后也是百度一了文章找到了原因所在。
其需要修改的宽度是.ant-tooltip-inner的宽度
上代码:

        <a-tooltip color="white" @mouseenter="hoverMethod(record)" overlayClassName="bgc_tooltip">
          <template #title>
            <a-table :columns="sendColumns" :data-source="data" bordered>
              <template #name="{ text }">
                <a>{{ text }}</a>
              </template>
            </a-table>
          </template>
          {{ record.send }}
          <!--          <a-button @hover="test(record)">{{ record.send }}</a-button>-->
        </a-tooltip>

<style lang="less">
  // 注意，vue 项目，style 标签不能加 scoped 选项，否则样式不生效
  .bgc_tooltip {
    .ant-tooltip-inner {
      // 这里是框框
      color: #333;
      max-width: 800px !important;[图片上传中...(image.png-1ef6a4-1652867772021-0)]
ant;
    }
    .ant-tooltip-arrow::before {
      // 这里是小三角形
      background-color: white !important;
    }
  }
</style>

image.png
使用官方的属性也不生效
参考文档: https://blog.csdn.net/dark_cy/article/details/116986569