Question

我尝试使用react-dates和react-with-styles在Typescript中设置Aphrodite Error using sin Not enough input arguments.的样式。我正在使用此代码，模仿https://github.com/airbnb/react-dates#interfaces中的代码：

DayPickerRangeController

但是，当我运行此操作时，我在控制台中收到此运行时错误：

const ThemedStyleSheet = require('react-with-styles/lib/ThemedStyleSheet').default
const aphroditeInterface = require('react-with-styles-interface-aphrodite').default
const DefaultTheme = require('react-dates/lib/theme/DefaultTheme').default

ThemedStyleSheet.registerInterface(aphroditeInterface)
ThemedStyleSheet.registerTheme(DefaultTheme)

// Importing react-dates after registering the theme, as per the docs.
import * as ReactDates from 'react-dates'

我在以下情况下没有收到此错误：

我使用了类中的Cannot read property 'createLTR' of undefined TypeError: Cannot read property 'createLTR' of undefined at Object.createLTR (http://localhost:6006/static/preview.bundle.js:133281:47) at createStyles (http://localhost:6006/static/preview.bundle.js:9710:59) at WithStyles.maybeCreateStyles (http://localhost:6006/static/preview.bundle.js:9805:22) at WithStyles.componentWillMount (http://localhost:6006/static/preview.bundle.js:9739:20) at callComponentWillMount (http://localhost:6006/static/preview.bundle.js:42214:16) at mountClassInstance (http://localhost:6006/static/preview.bundle.js:42310:7) at updateClassComponent (http://localhost:6006/static/preview.bundle.js:43679:9) at beginWork (http://localhost:6006/static/preview.bundle.js:44320:16) at performUnitOfWork (http://localhost:6006/static/preview.bundle.js:47152:16) at workLoop (http://localhost:6006/static/preview.bundle.js:47181:26)函数（但这并不允许我为组件设置样式）。（这让我感到惊讶，因为the code in registerInterfaceWithDefaultTheme看起来与我所拥有的一样（至少对我而言））
```
registerInterfaceWithDefaultTheme
```
我使用const aphroditeInterface = require('react-with-styles-interface-aphrodite').default const registerInterfaceWithDefaultTheme = require('react-dates/lib/utils/registerInterfaceWithDefaultTheme') .default registerInterfaceWithDefaultTheme(aphroditeInterface)（最终调用import 'react-dates/initialize';）。

我在以下情况下仍会收到此错误：

我交换了注册主题和界面的顺序
我在registerInterfaceWithDefaultTheme文件的顶部添加了ThemedStyleSheet代码，而不是在使用src/index的文件中添加{这是DayPickerRangeController中的建议修补程序3}}）
我将https://stackoverflow.com/a/48558841/1176156中的确切代码放入Javascript中，然后将其导入我使用DayPickerRangeController的Typescript文件。

我已在调试器中确认我的所有导入都获得了有效的代码，而不是例如undefined。

Answer 1

如果您使用多个AirBnB组件（通常的嫌疑犯包括react-dates和rheostat），就会经常发生这种情况，因为它们都（在我看来）建议在他们的文档样式中使用此问题（解决方案）。

我确定，如果您在代码库中搜索ThemedStyleSheet，将会发现这不是您唯一使用它的地方。此外，还要注意各种AirBnB组件的“初始化”调用，如果在您的代码之后运行，则会覆盖您的主题和提供程序，并造成进一步的麻烦。我说这很黑...

您必须将所有与ThemedStyleSheet相关的逻辑从整个代码库中的提升到最顶层，在加载任何其他内容之前，都应使用组合的相关主题对其进行一次调用。（请参见此github问题：https://github.com/airbnb/rheostat/issues/179）

如何使用带有react-dates的自定义主题？

1 个答案: