The problem of slow display of the title attribute of a tag is solved

I believe that those of you who can find this answer, like me, feel a bit mullet. In fact, if you don’t say it, you won’t find it. Once you talk about it, you will find that the display of the title of the a tag is indeed a little slow, especially when it is displayed for the first time. Well, since this question has been raised, let's solve it. How to solve it? I searched a lot on the Internet, and there are all kinds of things. Anyway, the same thing is always the same, that is, if it doesn't work, just change it. Write one yourself.

Here is the original code:

        <a href="/" title="xxx">
          <img
            className="cr-page__logo"
            src={require('@/assets/h5/logo.png')}
          />
        </a>

The solution is to switch to Tooltip! !

          <Tooltip
            placement="right"
            title={
              <div className={styles.tips}>
                <div>XXX</div>
              </div>
            }
          >
            <Icon className={styles['icon-i']} type="icon-i" />
          </Tooltip>

In short, it is very simple, wrap a layer of tooltip outside.

Some people say that it is okay to write a mouse move in and out with jQuery. Considering it's too troublesome, I won't try it.

[Don't panic when you encounter problems, just change your mind and it's ok]