如何将 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 上实现。 谢谢您的帮助。