Question

react-datetime包含了一个打字稿定义文件，但它不起作用（对我来说）。从我所看到的情况来看，ts definition file导出的其他类型（ReactDatetime）与实际javascript file（Datetime）不同。

我继续更改react-datetime.d.ts打字文件以导出（我认为）正确的类型（gist中提供）：

interface Datetime extends React.ComponentClass<DatetimepickerProps> {}
export { Datetime }

TypeScript抱怨它无法找到Datetime：

(26,10): error TS2304: Cannot find name 'Datetime'.

我觉得在打字和这个组件方面我必须缺少一些非常基本的东西。尽管使用react-datetime.d.ts指令引用了/// <reference path="../node_modules/react-datetime/react-datetime.d.ts" />文件，但尝试使其与原始打字文件一起使用导致无法首先导入模块。

尝试使用<Datetime/>的类的简约示例：

/// <reference path="../../node_modules/react-datetime/react-datetime.d.ts" />
import * as React from "react";
import { Datetime } from "react-datetime";


export interface DateTimeResolutionProps { timestamp: number, resolution: number }
export class DateTimeResolutionPicker extends React.Component<DateTimeResolutionProps, {}> {
    render() {
        // console.log(Datetime);
        return (<div>
        <Datetime/>
        </div>);
    }

}

Answer 1

您应该像导入React模块一样导入它：

import * as Datetime from "react-datetime";

然后它不会抱怨找不到Datetime。

至于名称，您可以决定名称，如果您愿意，可以ReactDatetime：

import * as ReactDatetime from "react-datetime";

React模块也是如此，如果您查看它将显示的定义文件：

declare namespace __React {
    ...
}

declare module "react" {
    export = __React;
}

Answer 2

您正在导出Datetime作为类型，即使React组件需要是一个值（无论是SFC还是类）。这就是你的版本无法正常工作的原因。

The version on the repo目前将其定义为CommonJS模块，这意味着现在应该需要与CommonJS兼容的语法：

import Datetime = require("react-datetime");

如何使用react-typescript的react-datetime（在tsx中）

2 个答案: