Преобразование в машинописный текст для Antdesign Datepicker

Я не могу понять, как аннотировать параметр 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;

Вот что говорит Цлинт -

Тип '(dateObj: Date, dateStr: string) => void' не может быть присвоен типу '(date: Moment, dateString: string) => void'. Типы параметров dateObj и date несовместимы. Тип «Момент» нельзя присвоить типу «Дата». Свойство toDateString отсутствует в типе Moment

Но я не знаю, как это преодолеть.


reactjs typescript react-hooks
person HalfWebDev    schedule 01.01.2019    source источник
comment
Moment предоставляет свои собственные типы ввода, я никогда не пробовал это лично, но проверьте, помогает ли это вам: stackoverflow.com/a/45584936/ 236205   -  person Canastro    schedule 01.01.2019

Ответы (2)


arrow_upward
1
arrow_downward

Просто вставьте этот ответ в эту тему, поскольку он, похоже, решает эту проблему и не был отмечен как правильный ответ в другом вопросе: Как можно импортировать moment.js с помощью машинописного текста?

Вам необходимо импортировать moment () функцию и Moment класс отдельно в TS.

Я нашел примечание в документах машинописного текста здесь.

/ * ~ Обратите внимание, что модули ES6 не могут напрямую экспортировать вызываемые функции. * ~ Этот файл следует импортировать в стиле CommonJS: * ~ import x = require ('someLibrary');

Таким образом, код для импорта моментальных js в машинописный текст на самом деле выглядит так:

import { Moment } from 'moment'
....
let moment = require('moment');
...
interface SomeTime {
  aMoment: Moment,
}
...
fn() {
  ...
  someTime.aMoment = moment(...);
  ...
}
person Canastro    schedule 01.01.2019

arrow_upward
1
arrow_downward

Просто это было необходимо.

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

а потом

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

Нет необходимости выполнять отдельный импорт для Moment, поскольку interface и NOT class существуют в пространстве имен моментов согласно этому ссылка

person HalfWebDev    schedule 01.01.2019