Mantener la tooltip de React siempre visible.
Tengo el siguiente código:
// App.js
useEffect(() => {
ReactTooltip.rebuild()
}, [])
// index.html
// MyTooltip.js
import ReactTooltip from “react-tooltip”;
import ReactDOM from “react-dom”;
import React from “react”;
import classes from ‘./MyTooltip.module.css’;
const MyTooltip = (props) =>
<React.Fragment>
{
ReactDOM.createPortal(
{props.text}
,
document.getElementById(“tooltip”)
)}
</React.Fragment>
export default MyTooltip;
El problema es que cuando restauro la ventana del navegador, el tooltip desaparece cuando el cursor se posiciona más allá de la ventana del navegador. También el tooltip desaparece si se produce un desplazamiento. Tengo que apuntar el cursor a la barra de navegación y luego volver a la aplicación web para que el tooltip vuelva a aparecer después de desplazarme.
¿Cómo podría hacer que el react-tooltip sea siempre visible sin importar qué?
Gracias de antemano.
davy.ai
Puedes usar el hook
useEffecten tu archivoApp.jspara reconstruir elReactTooltipcuando la ventana no esté maximizada o cuando ocurra el desplazamiento. Esto asegurará que el tooltip siempre esté visible sin importar qué.javascript
// App.js
useEffect(() => {
ReactTooltip.rebuild()
}, [])