小编Vas*_*ash的帖子

目前我正在尝试创建这个设计。

它没有按预期打开和关闭。我还创建了一个代码沙盒

三件事：
1.我有一个onClick，但我不确定我打开和关闭按钮的逻辑是否正确。还应该有一个useEffecthere来听更改吗？

const showPlatformOptions =()=> {
  //  let checkboxes = el;
  //  console.log("ref:",myRef.current)
  //   if (!expanded) {
  //    //checkboxes.style.display = "block";
  //     setExpanded(true);
  //   } else {
  //   // checkboxes.style.display = "none";
  //     setExpanded(false);
  //   }


  }

2. 我有一个 onChange 调用selectionOptions应该让我知道选择了哪些平台，但它目前一次只显示一个平台，为什么？

3. 是否有另一种方法来创建此下拉列表和复选框。也许是使用钩子的图书馆？

任何帮助表示赞赏。

import React, { useState,useEffect, useRef} from "react";


const SearchBar =()=>{
  const [query, setQuery] = useState("");
  const [expanded,setExpanded] = useState(false);
  const [selectionOptions, setSelectionOptions] = useState(["Instagram","LinkedIn","Twitter"]);
  const myRef = useRef(null);

  const showPlatformOptions =()=> …