我希望我的h4、h2和p标记在我单击它们时更改输入
我如何使用reactjs简单地做到这一点呢?
export default function requestCard(props) {
return (
<div className="Card">
<div className="Card-Top">
<div className="Top-Left">
<IoIosRadioButtonOn />
<h4>{props.data.Status}</h4>
</div>
<div className="Top-Right">
<h4>{props.data.Date}</h4>
</div>
</div>
<div className="Card-Middle">
<h2>{props.data.CutStyle}</h2>
<p>{props.data.client}</p>
</div>
<div className="Card-Bottom">
<img src={props.data.Picture} alt="new photos" />
<h2>{props.data.name}</h2>
</div>
</div>
);
}发布于 2020-04-10 02:16:03
你可以像下面这样做(例如状态)
const [statusEdit, setStatusEdit] = useState(false);
const [status, setStatus] = useState(props.data.Status);然后在return部分中按如下所示编写:
<div className="Top-Left">
<IoIosRadioButtonOn />
{
statusEdit ?
<input value={status} onChange={(e)=>{setStatus(e.target.value)}} onKeyDown={(e) => {if(e.keyCode === 13) setStatusEdit(false)}} />:
<h4 onClick={() => setStatusEdit(true)} >{status}</h4>
}
</div>https://stackoverflow.com/questions/61127157
复制相似问题