'NEXT JS exported pages not getting new Date

I am having a problem with my export functionality on package.json

enter image description here

I want to get todays date in my website, but it gets only today of my last update.

I tried 2 approaches:

1- Function to get new Date()

export function dateInput() {
  const getDateNow = () => {
      return new Date();
  };
  
  return (
    <div className="date_input">
      <select className={styles.selectInput} name="day" onChange={handleChangeDay} defaultValue={getDateNow().getDate()}>
            {choseDate.map((item, index) => {
                return (
                    <option key={`date_${index}`} value={item}>
                        {item}
                    </option>
                );
            })}
        </select>
        <select className={styles.selectInput} name="month" onChange={handleChangeMonth} defaultValue={getDateNow().getMonth() + 1}>
            {months.map((item, index) => {
                return (
                    <option key={`month_${index}`} value={index + 1}>
                        {item}
                    </option>
                );
            })}
        </select>
    </div>
  );
}

If i post it in january 10th, it freezes in 10/01

2- With useState

export function dateInput() {
    const [now, setNow] = useState(new Date());
    useEffect(() => {
        setNow(new Date());
    }, [])
    
    const months = [
        'Janeiro',
        'Fevereiro',
        'Março',
        'Abril',
        'Maio',
        'Junho',
        'Julho',
        'Agosto',
        'Setembro',
        'Outubro',
        'Novembro',
        'Dezembro',
    ];

    const biggestDays = [
        1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25,
        26, 27, 28, 29, 30, 31,
    ];
    const [choseDate, setChoseDate] = useState(biggestDays);

    return (
        <div className="date_input">
            <select className={styles.selectInput} name="day" onChange={handleChangeDay} defaultValue={now.getDate()}>
                {choseDate.map((item, index) => {
                    return (
                        <option key={`date_${index}`} value={item}>
                            {item}
                        </option>
                    );
                })}
            </select>
            <select className={styles.selectInput} name="month" onChange={handleChangeMonth} defaultValue={now.getMonth() + 1}>
                {months.map((item, index) => {
                    return (
                        <option key={`month_${index}`} value={index + 1}>
                            {item}
                        </option>
                    );
                })}
            </select>
        </div>
    );
}

The problem is that both of them keep my dateinput FREEZED on the 10th of january.. what should i do??



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source