#help useRef within useEffect

Bay Area Ninja — Fri, 15 Apr 2022 00:47:56 +0000

my Goal: Is to create a simple effect that prints out a string one letter at a time.

example: string = "TEXT". it should print T E X T

Whats currently being printed is: T X T undefined

my code:

`const [placeholder, setPlaceholder] = useState('');
const
string = 'TEXT',
index = useRef(0);

useEffect(() => {
function showChar() {
setPlaceholder(prev => prev + string[index.current]);
console.log(index.current)
index.current++;
}
if (index.current < string.length) {
let addChar = setInterval(showChar, 500);
return () => clearInterval(addChar);
}
}, [placeholder]);

return (

{placeholder}

)

export default App;`

DEV Community: Bay Area Ninja

#help useRef within useEffect