如何將 Vanilla JS 轉換為 NextJS

Question

我是 React 和 NextJS 的新手，我有一個使用 Hotel Datepicker Master 和 Fecha 日期格式化和解析的小項目，它安裝在我的項目中。 我正在嘗試將我的項目轉換為 React/NextJS，但問題是我無法弄清楚如何將我的 Vanilla JS 代碼轉換為 NextJS。

這是我的香草 JS 代碼：

(function() {
let today = new Date();
let tomorrow = new Date();
tomorrow.setDate(tomorrow.getDate() + 1);
let input1 = document.querySelector('#checkIn');
input1.value = fecha.format(today, 'YYYY-MM-DD') + ' - ' + 
fecha.format(tomorrow, 'YYYY-MM-DD');
  let demo1 = new HotelDatepicker(input1);
})();

結果：

這是我迄今為止在 NextJS 上嘗試過的：

_app.js 文件

import '../styles/globals.css'
import '../hotel-datepicker-master/dist/css/hotel-datepicker.css'
import '../node_modules/fecha/dist/fecha.min.js'
import '../hotel-datepicker-master/dist/js/hotel-datepicker.js'

function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />
}

export default MyApp

hero.jsx 文件

useEffect(() => {
let today = new Date();
let tomorrow = new Date();
tomorrow.setDate(tomorrow.getDate() + 1);
let input1 = dateInput.current.value;
input1.value = fecha.format(today, 'YYYY-MM-DD') + ' - ' + 
fecha.format(tomorrow, 'YYYY-MM-DD');
let demo1 = new HotelDatepicker(input1);}, [dateInput]);

結果：未捕獲的類型錯誤：無法讀取未定義的屬性（讀取“格式”）

你能告訴我如何進行轉換嗎？ 先感謝您。

Answer 1

嘗試

import { format } from 'fecha';

接着

input1.value = format(today, 'YYYY-MM-DD') + ' - ' + 

Answer 2

我決定使用 react 日期范圍選擇器而不是帶有 fecha 的酒店日期選擇器大師，它很容易在 nextjs 上實現。 謝謝您的幫助。