Javascript 在react.js/add中传递属性到收藏夹

我有一个项目的映射手风琴，每个项目都有一个

收藏夹

-图标。单击该图标后，它需要更改颜色（已经这样做了），并将

BadgeButton

的

{name.toUpperCase（）}

属性传递到

收藏夹

-页面。有人能给我解释一下吗？任何帮助都将不胜感激

这是手风琴的

页面：

export default function Accordion({ name, description, use, recipe, liked }) {
  const [clicked, setClicked] = useState(false);

  function handleClick() {
    setClicked(!clicked);
  }

  return (
    <AccordionDiv>
      <AccordionHead onClick={handleClick}>
        <div>
          <BadgeButton>{name.toUpperCase()}</BadgeButton>
          <StyledArrow clicked={clicked} />
        </div>
        <div>{use}</div>
      </AccordionHead>
      <AccordionContent clicked={clicked}>
        <span>{description}</span>
        <p>{recipe}</p>
        <StyledIcons>
          <Favourite liked={liked} />
          <Vote />
        </StyledIcons>
      </AccordionContent>
    </AccordionDiv>
  );
}

export default function Favourites() {
  return (
    <WrapperDiv>
      <Header />
      <Title headline>FAVOURITES</Title>
      <BadgeButtonClose>{}</BadgeButtonClose>
    </WrapperDiv>
  );
}

您必须在状态中设置名称，并将其作为道具传递给收藏夹。像这样的事情：

const [nameClicked, setNameClicked] = useState("");

function handleClick() {
    setClicked(!clicked);
    setNameClicked(name);
}

<AccordionDiv>
    ...
    <Favourite liked={liked} name={nameClicked} />
</AccordionDiv>

const[nameClicked，setNameClicked]=useState（“”）；
函数handleClick（）{
setClicked（！clicked）；
setNameClicked（名称）；
}
...
请向我们展示此属性是如何工作的，BadgeButton是什么样子，解释您为什么要传递它，aloborate