时间戳

首页 > 解决方案 > onClick 从组件中删除数据

javascript - onClick 从组件中删除数据

问题描述

所以基本上我有两个组件。在组件 1 中有一个 img。在组件 2 中有一个按钮。当我按下按钮时，我需要 img 消失，按钮也消失。

const Icons=()=> {
  return (
        <div className="_icons">
             <div className="icons__Top">
             <img src="./icons/-48.png" alt="Twitter"/>
                  <figcaption>Whatever</figcaption>
             </div>
        </div>

const Button= () => {
    return (
        <div className="button">
            <Button variant="outlined" className="button__rightpage" >REMOVE</Button>
            <caption className="text" ></caption>
        </div>
    )
}

标签： javascriptreactjs

解决方案

可以有不止一种解决方案，1）我认为您需要为两个组件拥有一个父组件并在父组件中创建一个状态，然后将其传递给图标组件并将其传递给 img 并默认将其设置为 false 然后从按钮组件将该状态更改为 true。

2）没有父组件->您也可以使用上下文api直接从按钮组件更改值并隐藏img。

推荐阅读