React typescript, свойство «propTypes» не существует для типа «typeof TodoFilterItem». ТС2339

у меня есть интерфейс

interface ITodoFilterItem  {
  name: string,
  filter: string,
  filterTodos: any
}

и класс в том же файле, который на него ссылается

class TodoFilterItem extends Component<ITodoFilterItem> {
  constructor (props:ITodoFilterItem) {
    super(props);
    this.handleFilter = this.handleFilter.bind(this);
  }

но когда я пытаюсь добавить propTypes внизу этого файла с помощью

TodoFilterItem.propTypes = {
  name: PropTypes.string,
  filter: PropTypes.string,
  filterTodos: PropTypes.any
}

Я получил:

Property 'propTypes' does not exist on type 'typeof TodoFilterItem'.  TS2339

к вашему сведению: у меня import PropTypes from 'prop-types'; вверху


reactjs typescript react-proptypes
person Michael Durrant    schedule 20.07.2020    source источник
comment
Вам нужен propTypes, так как вы уже определяете свойства через Component<MyProps, MyState>? Помимо времени компиляции и времени выполнения, я обычно просто использую одно или другое.   -  person lux    schedule 20.07.2020
comment
stackoverflow.com/questions/41746028/   -  person lux    schedule 20.07.2020
comment
да, я хочу использовать оба в этом случае   -  person Michael Durrant    schedule 20.07.2020
comment
Отвечает ли это на ваш вопрос? Ошибки Typescript при преобразовании проекта React   -  person jonrsharpe    schedule 21.07.2020

Ответы (1)


arrow_upward
5
arrow_downward

TS требует, чтобы все статические свойства были инициализированы в определении класса. Добавьте следующее в свой класс, чтобы убедиться, что TS может правильно проанализировать класс.

static propTypes: {
   name: Requireable<string>;
   filter: Requireable<string>;
   filterTodos: Requireable<any>;
};

import React, { Component, Requireable } from 'react';
import PropTypes from 'prop-types';

interface ITodoFilterItem {
    name: string;
    filter: string;
    filterTodos: any;
}

class TodoFilterItem extends Component<ITodoFilterItem> {
    static propTypes: {
        name: Requireable<string>;
        filter: Requireable<string>;
        filterTodos: Requireable<any>;
    };

    constructor(props: ITodoFilterItem) {
        super(props);
        this.handleFilter = this.handleFilter.bind(this);
    }

    handleFilter() {}

    render() {
        return <span />;
    }
}

TodoFilterItem.propTypes = {
    name: PropTypes.string,
    filter: PropTypes.string,
    filterTodos: PropTypes.any,
};

export default TodoFilterItem;
person lux    schedule 20.07.2020