Как набрать свойство key в компоненте Preact без сохранения состояния - PullRequest
Новая
       16

Как набрать свойство key в компоненте Preact без сохранения состояния

0 голосов
/ 22 мая 2019

Вот компонент без сохранения состояния: 

interface Props {
  children: JSX.Element;
  title: string;
  isHidden: boolean;
}

function TabContent({ children, title, isHidden }: Props): JSX.Element {
  return (
    <section
      id={title}
      hidden={isHidden}
    >
      {children}
    </section>
  );
}

export default TabContent;

И я потребляю его в виде map примерно так: 

createTabContent = tabs => {
    return tabs.map((tab, id) => (
      <TabContent key={id} title={tab.title} isHidden={!(this.state.activeTab === id)}>
        {tab}
      </TabContent>
    ));
  };

Но Typescript жалуется на Property 'key' does not exist on type Props.

Я рассмотрел, как печатать компонент без сохранения состояния в React, как это guide .Все они требуют доступа к модулю React, но я использую Preact ..

1 Ответ

1 голос
/ 23 мая 2019

Preact имеет аналогичные компоненты React . Таким образом, вы можете использовать один из ComponentType, FunctionComponent, FunctionalComponent: 

import { FunctionalComponent } from 'preact';

const TabContent: FunctionalComponent<Props> = ({ children, title, isHidden }) => (
    <section
        id={title}
        hidden={isHidden}
    >
        {children}
    </section>
);
...