如何將 React-bootstrap 模式與 typescript 一起使用

Question

我正在使用 react、react-bootstrap 和 typescript。 我收到以下錯誤：

JSX 元素類型“模態”沒有任何構造或調用簽名。 TS2604

如果我使用 javascript，該代碼是來自 react-bootstrap 網站的非常樣板：

import React, { Component } from "react";
import Modal from 'react-bootstrap';

class InfoModal extends Component{
    state = { show: true }

    render(){
     <Modal show={show} onHide={handleClose}>
        <Modal.Header closeButton>
          <Modal.Title>Modal heading</Modal.Title>
        </Modal.Header>
        <Modal.Body>Woohoo, you're reading this text in a modal! 
        </Modal.Body>
        <Modal.Footer>
          <Button variant="secondary" onClick={handleClose}>
            Close
          </Button>
        </Modal.Footer>
      </Modal>
    }
}

Answer 1

有一些問題，所以我希望這可以幫助任何有同樣問題的人：

1. 導入錯誤應該是： import { Modal, Button } from 'react-bootstrap';
2. onHide={() => { this.handleClose() }}