material-ui-pickers示例：TypeError：Object（…）不是函数

Question

我正在尝试使用一个裸项目并遵循此处描述的安装和使用步骤来设置最基本的可能的材料UI选择器示例：https : //material-ui-pickers.dev/

我收到以下错误：

TypeError: Object(...) is not a function

Module../node_modules/@material-ui/pickers/dist/material-ui-pickers.esm.js

node_modules/@material-ui/pickers/dist/material-ui-pickers.esm.js:25

  22 | import Tab from '@material-ui/core/Tab';

  23 | import Tabs from '@material-ui/core/Tabs';

  24 | import Paper from '@material-ui/core/Paper';

> 25 | var useStyles = makeStyles(function (theme) {

  26 |   var textColor = theme.palette.type === 'light' ? theme.palette.primary.contrastText : theme.palette.getContrastText(theme.palette.background.default);

  27 |   return {

  28 |     toolbarTxt: {

我遵循的步骤是：

create-react-app material-ui-pickers-demo

yarn add @material-ui/core

yarn add @material-ui/pickers

yarn add @date-io/date-fns

import React, { useState } from "react";

import DateFnsUtils from "@date-io/date-fns"; // choose your lib

import {

  DatePicker,

  TimePicker,

  DateTimePicker,

  MuiPickersUtilsProvider,

} from "@material-ui/pickers";

function App() {

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

  return (

    <MuiPickersUtilsProvider utils={DateFnsUtils}>

      <DatePicker value={selectedDate} onChange={handleDateChange} />

      <TimePicker value={selectedDate} onChange={handleDateChange} />

      <DateTimePicker value={selectedDate} onChange={handleDateChange} />

    </MuiPickersUtilsProvider>

  );

}

export default App;

yarn start

纱线版本为1.16.0节点版本为v12.1.0

Answer 1

原因是的版本错误@material-ui/core。目前@material-ui/pickers仅能正常使用@material-ui/core@v4.0.0-beta.1。@ material-ui / core beta 1和@ material-ui / pickers太原始了，无法在项目中使用它们。因此，要解决您的问题，您需要执行以下步骤：删除node_modules目录并运行yarn add @material-ui/core@v4.0.0-beta.1&nbsp;，最后运行@material-ui/pickers@3.0.0-beta.1&nbsp;它应该可以修复该错误。