reactjs - 无法在React js Web应用程序中使用material-ui-pickers

Question

我正在尝试在react应用程序中实现Material-ui-picker。

下面的集成代码link

尝试实现免费设计部分

我使用了单独文件中文档中的代码并安装了所有软件包，但找不到模块:错误:无法解析“date-fns/format”然后我尝试从节点模块文件夹路径导入 date-fns 链接，如下所示从 '../../../../node_modules/date-fns/form' 导入 DateFnsUtils 然后出现以下错误。

有人成功集成了material-ui-pickers ..请推荐

Answer 1

请参阅official documentation

您需要安装并传递utils。首先为您的库安装 utils:

npm install date-fns @date-io/date-fns

然后将它们传递给utils提供者

import React, { useState } from "react";
import DateFnsUtils from "@date-io/date-fns"; // import
import { DatePicker, MuiPickersUtilsProvider } from "@material-ui/pickers";

function App() {
  const [selectedDate, handleDateChange] = useState(new Date());

  return (
    <MuiPickersUtilsProvider utils={DateFnsUtils}>
      <DatePicker value={selectedDate} onChange={handleDateChange} />
    </MuiPickersUtilsProvider>
  );
}

Here是可以玩的沙盒:)