I have some text that I want to simply highlight using a simple react package called 'react-animarker'. I have tried to use useState hook as I want to dynamically update the speed of the animation as shown. However, the duration does not change the way I want it to. But in the console, it does show as changing. Any ideas as to why?
Link to React Package: https://github.com/ramonmetzker/react-animarker
import React, {useState} from 'react'
import {Mark} from 'react-animarker'
const Highlightx = () => {
const [speed, setSpeed] = useState(5)
const handleClick = () => {
setSpeed(20)
console.log(speed);
}
return (
<>
<Mark duration={speed}>Highlightx</Mark>
<button onClick={handleClick}>Hello</button>
</>
)
}
export default Highlightx