When changing the data-tip doesn't refresh the the tooltip

I have this tooltip, that has a dynamic data-tip:

<span data-tip={switchTip} onClick={this.props.switchType}><i className="icon-refresh" />Switch to {oppositeType}</span>

when switchTip changes, it doesn’t refresh the information inside the data-tip, is this an issue, or more like a feature?

Thanks in advance!

[alejandrosobko]

You have to add getContent to the ReactTooltip. This worked for me:

<span data-tip={this.copyMessage()} />
<ReactTooltip effect="solid" getContent={this.copyMessage} />

copyMessage is the function that returns the message dynamically.

[SlimGabsi]

the solution is to hide and then show the tooltip on state change and if your cmp is hovered . Note that am using functional cmps and useRef hook I guess you can do the same with componentDidUpdate() use onMouseEnter and onMouseLeave to set the hovred state

        const handleOnMouseLeave = () => {
		setIsHovered(false);
	};
	const handleOnMouseEnter = () => {
		setIsHovered(true);
	};

		useEffect(() => {
       if (myRef?.current && isHovered) {
		ReactTooltip.hide();
		ReactTooltip.show(myRef.current);
	}, [myState]);