iview的Tree组件设置Tooltip鼠标悬浮文字

在解决问题中考虑到的点：

1. 树形组件要是过多，会出现鼠标滚轮，鼠标滚轮的时候也会触发鼠标悬浮事件，这时候tooltip会显示出上次滚轮经过的文字，并且会出现tooltip闪动。

解决方法：

1. 使用防抖函数在组件的render里设置鼠标滚轮事件mousewheel

具体代码

data() {
	return {
		timeout: null,
      	showTooltip: true
	}
}

// tree 组件渲染 设置Tooltip
    renderContent(h, { root, node, data }) {
      let texts = "";
      if (
        data.title !== null &&
        data.title !== undefined &&
        data.title !== ""
      ) {
        texts = data.title;
      }
      return h(
        "div",
        {
          style: {
            display: "inline-block",
            width: "100%",
            cursor: "pointer",
          },
          on: {
            // 监听鼠标滚轮 防抖函数解决滚轮滚动出现tooltip闪烁
            mousewheel: () => {
              // 不滚动时清除定时器 不显示tooltip
              clearTimeout(this.timeout);
              this.showTooltip = false
              this.timeout = setTimeout(() => {
                this.showTooltip = true
                clearTimeout(this.timeout);
              }, 500);
            },
            // 设置事件为被动 不会因为主线程影响到这个事件
            passive: true
          },
        },
        this.showTooltip ? [
          h(
            "Tooltip",
            {
              props: {
                placement: "top",
                transfer: true,
                maxWidth: 270,
              },
            },
            [
              texts,
              h(
                "span",
                {
                  slot: "content",
                  style: {
                    whiteSpace: "normal",
                  },
                },
                data.title
              ),
            ]
          ),
        ] : [
              h(
                "span",
                {
                  slot: "content",
                  style: {
                    whiteSpace: "normal",
                  },
                },
                data.title
              ),
            ]
      );
    },
  },