webportClient/sources/src/Componets/Acardion.js

import React from "react";

export default class Accordion extends React.Component {
  style = {
    uptitle: {
      ontSize: "1.6em",
      padding: "5px",
      cursor: "pointer"
    }
  };
  ViewGroup(id) {
    if (document.getElementById(id + "_group").style.display === "none") {
      document.getElementById(id + "_group").style.display = " block";
    } else {
      document.getElementById(id + "_group").style.display = "none";
    }
  }

  render() {
    return (
      <div>
        <div
          id={this.props.title}
          class="Accrordion"
          onClick={() => this.ViewGroup(this.props.title)}
        >
          <h3>{this.props.title}</h3>
        </div>
        <div
          id={this.props.title + "_group"}
          style={{ display: "none", cursor: "pointer" }}
        >
          <div>{this.props.children}</div>
        </div>
      </div>
    );
  }
}