时间戳

首页 > 解决方案 > Bootstrap 组件 reactstrap 和 react.Component 之间的连接

reactjs - Bootstrap 组件 reactstrap 和 react.Component 之间的连接

问题描述

我是 Rect 的新手。我想问一个最基本的问题，因为我在 Google 上找不到相关文档或答案。以下是典型反应代码的前 3 行：

import React, { Component } from "react";
import {                                            
  Button,
  Modal,
} from "reactstrap";    
export default class CustomModal extends Component {
...
}

第二行从reactstrap导入的Bootstrap组件和react(即react.Component)中的Component类有什么联系？为什么是 react.Component 的 CustomModal 子类而不是 reactstrap.Modal？react.Component 是一种抽象类，reactstrap.Modal 具体类是扩展 react.Component 吗？

标签： reactjs

解决方案

基本上，是的。您扩展 React.Component 以创建您自己的基于类的自定义 React 组件。您正在导入的其他库来自库作者已经创建组件的库。请注意，您还可以在不扩展 React.Component 的情况下创建自定义的基于函数的 React 组件。我建议通读React.Component 文档。

关于它与 CustomModal 的关系的问题，您可以使用 Modal 作为 CustomModal 中的一个组件。例如：

import React, { Component } from "react";
import {                                            
  Button,
  Modal,
} from "reactstrap";    
export default class CustomModal extends Component {
    ...
    render() {
        return <Modal />;
    }
}

请注意，此示例只是为了让您了解如何在您自己的自定义组件中使用导入的组件。它不一定如何使用reactstrap.Modal它自己。

推荐阅读