我正在尝试使用blueprint DateInput组件,并且我已经完全遵循了文档,但是我就是不能让它工作。如果您有时间,我将非常感谢您的帮助!
下面是我的代码:
import React from 'react';
import * as moment from 'moment';
import { DateInput } from '@blueprintjs/datetime';
class SupplierPage extends React.Component { // eslint-disable-line react/prefer-stateless-function
constructor(props) {
super(props);
this.state = {
closeOnSelection: true,
date: null,
disabled: false,
format: FORMATS[0],
reverseMonthAndYearMenus: false,
timePrecision: undefined,
};
}
render() {
const { date, format, ...spreadProps } = this.state;
return (
<div>
<DateInput
{...spreadProps}
{...format}
defaultValue={new Date()}
className="foofoofoo"
popoverProps={{ popoverClassName: 'barbarbar', content: 'hi' }}
inputProps={{ className: 'bazbazbaz' }}
/>
</div>
);
}
}
export const FORMATS = [
{
formatDate: (date) => (date == null ? '' : date.toLocaleDateString()),
placeholder: 'JS Date',
parseDate: (str) => new Date(Date.parse(str)),
},
momentFormatter('MM/DD/YYYY'),
momentFormatter('YYYY-MM-DD'),
momentFormatter('YYYY-MM-DD HH:mm:ss'),
];
function momentFormatter(format) {
return {
formatDate: (date) => moment(date).format(format),
placeholder: `${format} (moment)`,
parseDate: (str) => moment(str, format).toDate(),
};
}下面是错误:
warning.js:33 Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in. Check the render method of `Blueprint2.Overlay`.
in Blueprint2.Overlay (created by Blueprint2.Popover)
in span (created by Manager)
in Manager (created by Blueprint2.Popover)
in Blueprint2.Popover (created by Blueprint2.DateInput)
in Blueprint2.DateInput (created by SupplierPage)
in div (created by SupplierPage)
in SupplierPage (created by Connect(SupplierPage))
in Connect(SupplierPage) (created by withReducer(Connect(SupplierPage)))
in withReducer(Connect(SupplierPage)) (created by Route)
in Route (created by App)
in Switch (created by App)
in div (created by App__AppWrapper)
in App__AppWrapper (created by App)
in App
in Router (created by ConnectedRouter)
in ConnectedRouter
in IntlProvider (created by LanguageProvider)
in LanguageProvider (created by Connect(LanguageProvider))
in Connect(LanguageProvider)
in Provider
printWarning @ warning.js:33
warning @ warning.js:57
createElement @ ReactElementValidator.js:190
(anonymous) @ overlay.js?fe9b:93
mapSingleChildIntoContext @ ReactChildren.js:105
traverseAllChildrenImpl @ traverseAllChildren.js:75
traverseAllChildren @ traverseAllChildren.js:170
mapIntoWithKeyPrefixInternal @ ReactChildren.js:125
mapChildren @ ReactChildren.js:147
Overlay.render @ overlay.js?fe9b:82
(anonymous) @ ReactCompositeComponent.js:793
measureLifeCyclePerf @ ReactCompositeComponent.js:73
_renderValidatedComponentWithoutOwnerOrContext @ ReactCompositeComponent.js:792
_renderValidatedComponent @ ReactCompositeComponent.js:819
_updateRenderedComponent @ ReactCompositeComponent.js:743
_performComponentUpdate @ ReactCompositeComponent.js:721
updateComponent @ ReactCompositeComponent.js:642
receiveComponent @ ReactCompositeComponent.js:544
receiveComponent @ ReactReconciler.js:122
updateChildren @ ReactChildReconciler.js:107
_reconcilerUpdateChildren @ ReactMultiChild.js:204
_updateChildren @ ReactMultiChild.js:308
updateChildren @ ReactMultiChild.js:295
_updateDOMChildren @ ReactDOMComponent.js:944
updateComponent @ ReactDOMComponent.js:758
receiveComponent @ ReactDOMComponent.js:720
receiveComponent @ ReactReconciler.js:122
_updateRenderedComponent @ ReactCompositeComponent.js:751
_performComponentUpdate @ ReactCompositeComponent.js:721
updateComponent @ ReactCompositeComponent.js:642
receiveComponent @ ReactCompositeComponent.js:544
receiveComponent @ ReactReconciler.js:122
_updateRenderedComponent @ ReactCompositeComponent.js:751
_performComponentUpdate @ ReactCompositeComponent.js:721
updateComponent @ ReactCompositeComponent.js:642
receiveComponent @ ReactCompositeComponent.js:544
receiveComponent @ ReactReconciler.js:122
_updateRenderedComponent @ ReactCompositeComponent.js:751
_performComponentUpdate @ ReactCompositeComponent.js:721
updateComponent @ ReactCompositeComponent.js:642
performUpdateIfNecessary @ ReactCompositeComponent.js:558
performUpdateIfNecessary @ ReactReconciler.js:154
runBatchedUpdates @ ReactUpdates.js:148
perform @ Transaction.js:141
perform @ Transaction.js:141
perform @ ReactUpdates.js:87
flushBatchedUpdates @ ReactUpdates.js:170
closeAll @ Transaction.js:207
perform @ Transaction.js:154
batchedUpdates @ ReactDefaultBatchingStrategy.js:60
batchedUpdates @ ReactUpdates.js:95
dispatchEvent @ ReactEventListener.js:145
invariant.js:42 Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in. Check the render method of `TransitionGroup`.
at invariant (invariant.js:42)
at instantiateReactComponent (instantiateReactComponent.js:72)
at Object.updateChildren (ReactChildReconciler.js:115)
at ReactDOMComponent._reconcilerUpdateChildren (ReactMultiChild.js:204)
at ReactDOMComponent._updateChildren (ReactMultiChild.js:308)
at ReactDOMComponent.updateChildren (ReactMultiChild.js:295)
at ReactDOMComponent._updateDOMChildren (ReactDOMComponent.js:944)
at ReactDOMComponent.updateComponent (ReactDOMComponent.js:758)
at ReactDOMComponent.receiveComponent (ReactDOMComponent.js:720)
at Object.receiveComponent (ReactReconciler.js:122)我是不是漏掉了什么明显的东西?我已经搜索了网络上所有可用的资源,但没有运气:
发布于 2018-03-26 15:06:55
伙计们,你需要react 16+才能让它工作。
https://stackoverflow.com/questions/49102436
复制相似问题