Javascript 包装react引导组件Typescript错误

我试图围绕引导的

警报
组件创建一个包装器组件

警报
组件上有
链接
和
标题
属性，因此您可以执行

您需要将
Alert.Link
和
Alert.Heading
组件从引导的警报命名空间复制到自定义的
Alert
组件上

import React from 'react';
import BootstrapAlert, { AlertProps } from 'react-bootstrap/Alert';

const Alert = (props: AlertProps) => {
  return <BootstrapAlert bsPrefix="my-app-alert" {...props} />;
};

// Copy the Heading and Link components from Bootstrap as well
// You might need to declare the Heading and Link properties on your Alert type too
Alert.Heading = BootstrapAlert.Heading;
Alert.Link = BootstrapAlert.Link;

export default Alert;

这就是react引导API的功能：

// Standard react-bootstrap usage
import { Alert } from 'react-bootstrap/Alert';

<Alert>
    <Alert.Heading>My alert heading</Alert.Heading>
    <Alert.Link>My link content</Alert.Link>
</Alert>

//标准react引导用法
从'react bootstrap/Alert'导入{Alert}；
我的机警标题
我的链接内容
您需要将
警报链接
和
警报标题
组件从引导的警报命名空间复制到自定义的
警报
组件上

import React from 'react';
import BootstrapAlert, { AlertProps } from 'react-bootstrap/Alert';

const Alert = (props: AlertProps) => {
  return <BootstrapAlert bsPrefix="my-app-alert" {...props} />;
};

// Copy the Heading and Link components from Bootstrap as well
// You might need to declare the Heading and Link properties on your Alert type too
Alert.Heading = BootstrapAlert.Heading;
Alert.Link = BootstrapAlert.Link;

export default Alert;

这就是react引导API的功能：

// Standard react-bootstrap usage
import { Alert } from 'react-bootstrap/Alert';

<Alert>
    <Alert.Heading>My alert heading</Alert.Heading>
    <Alert.Link>My link content</Alert.Link>
</Alert>

//标准react引导用法
从'react bootstrap/Alert'导入{Alert}；
我的机警标题
我的链接内容

// Define the Alert component
const Alert = React.forwardRef((uncontrolledProps, ref) => {
    //...implementation
});

// Then at the bottom of the file they add the `Alert.Link` and
// `Alert.Heading` properties to the component:

Alert.Link = createWithBsPrefix('alert-link', {
  Component: SafeAnchor,
});

Alert.Heading = createWithBsPrefix('alert-heading', {
  Component: DivStyledAsH4,
});

export default Alert;

// Standard react-bootstrap usage
import { Alert } from 'react-bootstrap/Alert';

<Alert>
    <Alert.Heading>My alert heading</Alert.Heading>
    <Alert.Link>My link content</Alert.Link>
</Alert>