打字稿不允许使用 React-notification-component {children?: ReactNode;} 将 props 传递给 children

问题描述

我正在使用 lib react-notifications-components 创建自定义通知。我需要将 id 从内容道具传递给子组件（通知），以便使用 onClick 事件关闭通知。但是当尝试这样做时，TypeScript 不断向我报告： “属性 'id' 不存在于类型 '{children?: ReactNode;}”

----------父亲-------

import { store } from 'react-notifications-component';

  const notification = () => {
    store.addNotification({
      id: 'myId',content: p => (
        <Notifications
          handleCloseConfirm={() => store.removeNotification(p.id)}
        />
      ),width: 500,container: 'bottom-left',// where to position the notifications
      animationIn: ['animated','fadeIn'],// animate.css classes that's applied
      animationOut: ['animated','fadeOut'],// animate.css classes that's applied
      dismiss: {
        duration: 0,// pauSEOnHover: true,click: false,touch: false,},});
  };

-----------child component----------

import React from 'react';
import { Container,Wrapper } from './styles';
import { Icon } from '../../commons';

interface Notificationsprops {
  handleCloseConfirm: () => void;
}

const Notifications: React.FC<Notificationsprops> = props => {
  const { handleCloseConfirm } = props;

  const handleSubmit = () => {
    handleCloseConfirm();
  };

  return (
    <Container>
      <div>
        <Icon iconName="notifications_success" />
      </div>
      <Wrapper>
        <p>Registro alterado com sucesso</p>
        <Icon iconName="notifications_close" onClick={() => handleSubmit} />
      </Wrapper>
    </Container>
  );
};

export default Notifications;

解决方法

我查看了文档，似乎 Typescript 类型有误。

$ export TA_LIBRARY_PATH=$PREFIX/lib $ export TA_INCLUDE_PATH=$PREFIX/include $ python setup.py install # or pip install ta-lib 被定义为不带 props 的组件：

content

但是 docs 说它会接收 content?: React.ComponentClass | React.FunctionComponent | React.ReactNode; 作为道具：

自定义通知内容，必须是类组件、功能组件或 React 元素。如果作为函数或类组件提供，id 将作为 prop 提供

---

您可以使用 id 来解决该错误。

p as any