我正在尝试隐藏和显示来自reactstrap的卡片组件中的数据

import React, { Component } from 'react';
import { Card, CardBody, Button } from 'reactstrap';

class DataCard extends Component {
  constructor(props) {
    super(props);
    this.state = {
      isDataVisible: false
    };
  }

  toggleDataVisibility = () => {
    this.setState(prevState => ({
      isDataVisible: !prevState.isDataVisible
    }));
  }

  render() {
    const { isDataVisible } = this.state;

    return (
      <Card>
        <CardBody>
          <Button onClick={this.toggleDataVisibility}>
            {isDataVisible ? '隐藏数据' : '显示数据'}
          </Button>
          {isDataVisible && (
            <div>
              <p>这里是要隐藏和显示的数据</p>
              <p>更多数据...</p>
            </div>
          )}
        </CardBody>
      </Card>
    );
  }
}

export default DataCard;