Как использовать Flux Container.create в Typescript 2.8 - PullRequest
Новая
       7

Как использовать Flux Container.create в Typescript 2.8

0 голосов
/ 15 мая 2018

Я пытаюсь обновить свой проект Reaction / Flux с машинописного текста 2.2 до 2.8.

У меня есть следующее определение магазина с помощью служебной функции container.create: 

import * as React from 'react';
import { Container } from 'flux/utils';

export let MyContainer = Container.create(class extends React.Component<props, state> {
    static getStores() {
        return [/* list of stores here*/]
    }

    static calculateState(prevState: state, props: props): state {
        return {hello: true}
    }

    render() {
        return <div>something</div>
    }
}, { withProps: true });

Если я экспортирую этот компонент и попытаюсь использовать его, я получаю следующую ошибку:

TS2605: JSX element type 'Component<props, ComponentState>' is not a constructor function for JSX elements.

Это работало нормально, когда я был на машинописном тексте 2.2, но после обновления я везде получаю ошибкипопробуйте использовать компонент контейнера следующим образом.

Я использую @ types / реагировать на типизацию версия 15.0.28. Вот определения для контейнеров с флюсом.

1 Ответ

0 голосов
/ 21 мая 2018

Видимо начиная с машинописного текста 2.6 эта ошибка возникает. Но я не уверен, какое критическое изменение вызывает такое поведение, похоже, что ни одно из них не соответствует .

Основная причина такова: 

let readOnlyOrVoid: Readonly<void | {}> // resolves to void | Readonly<{}>
let readOnlyOfAny: Readonly<any> // in 2.5 this resolves to any, in 2.6 it does not we still have Readonly<any>
readOnlyOfAny = readOnlyOrVoid; // valid in 2.5, not so in 2.6

Возвращаясь к React, ComponentState определяется в 15.0.23 как: 

type ComponentState = {} | void ;

В то время как state для JSX.ElementClass (что расширяет React.Component<any, any>) имеет тип Readonly<any>.

Поскольку Container.create вернет упакованный компонент с состоянием ComponentState, мы сталкиваемся именно с этой проблемой назначения Readonly<void | {}> (из упакованного компонента) в Readonly<any> (из определения JSX.ElementClass)

Самое простое решение - обновить набор для react до 15.0.39, который заменяет определение ComponentState на: 

type ComponentState = {};
...