如何制作可折叠的按钮

Question

我正在尝试使用搜索栏中的可扩展（可折叠）按钮来处理反应Web应用程序（如所附图片），但到目前为止找不到合适的方法，如果您知道能做到这一点的任何组件，将不胜感激

使用此代码定义了一个下拉按钮

return (
  <div class="dropdown">
    <button
      className="btn btn-square btn-outline-dark"
      type="button"
      data-toggle="dropdown"
      aria-expanded="false"
      aria-haspopup="true"
      id={name}
      onClick={this.toggleOpen}
    >
      {name}
    </button>
    <div className={menuClass} aria-labelledby={name}>
      <div className="card card-body">
        {children}
      </div>
    </div>
  </div>
);

这是我的代码的输出