Welcome to Software Development on Codidact!
Will you help us build our independent community of developers helping developers? We're small and trying to grow. We welcome questions about all aspects of software development, from design to code to QA and more. Got questions? Got answers? Got code you'd like someone to review? Please join us.
Are there other reasons why useEffect might not be defined apart from not importing it?
I am creating a button that once clicked will change from off to on with react and i am also creating a responsive clock through useEffect.
Yet the code still return that useEffect is undefined though i imported useState.
import {useState} from 'react';
import "./styles.css";
export default function App() {
let [PresentState, setPresentState] = useState(false);
let [time, seTime] = useState("00:00:00");
function toggleState() {
setPresentState((prevState) => !prevState);
}
function getTime() {
return new Date().getTime();
}
useEffect(() => {
setTime(getTime());
console.log();
return () => {};
},[]);
return (
<div className="app">
<button onClick={toggleState} className="btn">
{PresentState ? "On" : "Off"}
</button>
<time>00:00:00</time>
</div>
);
}
2 answers
You are accessing this answer with a direct link, so it's being shown above all other answers regardless of its score. You can return to the normal view.
Including the full file in the question
The question states that useState has been imported, but the codeblock does not include import { useState } from 'react';. Is this the full file or just an excerpt? It may be difficult to say for certain what is wrong from an excerpt, if the problem turns out to be in part of the code that was not included.
Possible typo in the code
The 4th line in the codeblock defines a state variable and an update function:
let [time, seTime] = useState("00:00:00");
The 13th line in the codeblock calls a function that has not been defined:
setTime(getTime());
Are seTime and setTime intended to be the same function? Is one of them a typo?
Helping to keep the code readable
As setTime is also a built in JavaScript method, it may help to choose a different name to avoid the conflict.
Using setTime as both a function and a method will not cause any errors, but may make the code misleading to someone reading it. It could be particularly confusing in this specific case because getTime has been made an alias of new Date().getTime() but setTime is not an alias of Date().setTime().
0 comment threads
0 comment threads