reactjs 具有多个变量的Date对象

hec6srdp  于 2023-05-06  发布在  React
关注(0)|答案(1)|浏览(110)

我在React上,我只是想用useState和useEffect来显示时间流逝(小时)来更新我的状态。在此之前没有问题,但在下面你可以看到我正在使用另一个Date对象。问题是,当我在JSX中使用它时,当我只想更新我的状态“time”时,每个值都会更新。有什么问题...?Any idea?ChatGPT在这里没有帮助:D

const [time, setTime] = useState((''))

    useEffect(() => {
        const interval = setInterval(() => {
            setTime(prevState => new Date().toLocaleTimeString())
        }, 1000);

        return () => clearInterval(interval);
    }, []);

const now = new Date();
    const dateString = now.toLocaleDateString();
    const dateStringTime = now.toLocaleTimeString();
    const isoString = now.toISOString();

    const milliSec = now.getTime();
    const annee = now.getFullYear();
    const month = now.getMonth();
    const jourMois = now.getDate();
    const seconds = now.getSeconds();
    const minutes = now.getMinutes();
    const heure = now.getHours();

我尝试了很多组合,在网上搜索,但没有答案。ChatGpt有儿子的答案,无法解释这一点,奇怪的是...

gwbalxhn

gwbalxhn1#

如果我对你的问题理解正确的话:
第二个const date now在每次页面呈现时更新。因此,两个“时间”变量都得到更新。
一个解决方案可能是将它们都存储在一个状态中。

const [time, setTime] = useState('')
const [secondTime, setSecondTime] = useState('')

然后在useEffect期间设置第二个日期。

const now = new Date();
    useEffect(() => {
        setSecondTime(now);
        const interval = setInterval(() => {
            setTime(prevState => new Date().toLocaleTimeString())
        }, 1000);

        return () => clearInterval(interval);
    }, []);

这是否有助于/回答您的问题?

相关问题