Question

我不知道如何在我已经使用的dateObj函数中注释handleDateChange参数

App.tsx

import { useState } from 'react';
import logo from './logo.svg';
import './App.css'; 
import { DatePicker } from 'antd';       // for css
import moment from 'moment';

const App = () => {
    const [date, setDate] = useState(new Date())
    const handleDateChange = (dateObj: Date, dateStr: string) => {
        setDate(dateObj);
    }
    return (
        <div className="App">
            <DatePicker defaultValue={moment(date)} onChange={handleDateChange} />
            <header className="App-header">
                <img src={logo} className="App-logo" alt="logo" />
                <p>
                    Edit <code>src/App.tsx</code> and save to reload.
                </p>
                <a
                    className="App-link"
                    href="https://reactjs.org"
                    target="_blank"
                    rel="noopener noreferrer"
                >
                    Learn React
                </a>
            </header>
        </div>
    );
}

export default App;

tslint说的是-

类型'（dateObj：日期，dateStr：字符串）=>无效'不能分配给类型'（日期：时刻，dateString：字符串）=>无效'。参数“ dateObj”和“ date”的类型不兼容。类型“ Moment”不能分配给类型“ Date”。类型'Moment'中缺少属性'toDateString'

但是我不确定如何克服这个问题。

Answer 1

只是将此答案推入了本主题，因为它似乎可以解决此问题，并且在另一个问题中没有被标记为正确答案：How can moment.js be imported with typescript?

您需要在TS中分别导入 moment（）函数和 Moment 类。

我在打字稿文档here中找到了一个注释。

/ *〜请注意，ES6模块不能直接导出可调用函数。 *〜此文件应使用CommonJS样式导入： *〜import x = require（'someLibrary'）;

因此将moment js导入到typescript中的代码实际上是这样的：

do.call(rbind, lapply(split(df, df$a), tail, 2))

Answer 2

这是必需的。

 const [date, setDate] = useState(moment(new Date()));
 const handleDateChange = (dateObj: moment.Moment, dateStr: string): void => {
    setDate(dateObj);
}

然后

 <DatePicker defaultValue={date} onChange={handleDateChange} />

Moment不需要单独导入，因为interface且根据此reference的时刻名称空间中不存在class

转换为Antdesign Datepicker的Typescript

2 个答案: