我需要在reactjs中打開一個非常簡單的搜索欄，并且沒有關閉按鈕，因為我想點擊同一個按鈕來關閉它。
這是我嘗試過但沒有用的一些代碼。
const [searchIsOpen, setSearchIsOpen] = useState(false);
const search = () => {
if (searchIsOpen) {
setSearchIsOpen(true);
} else {
setSearchIsOpen(false);
}
};
<button onClick={search}
className="absolute md:left-8 left-3 lg:left-2 top-6 md:top-8 cursor-pointer">
</button>
這個元素應該打開。
<div>
<input type="text" name="" id="" />
</div>
謝謝你。
uj5u.com熱心網友回復：
您應該使用條件渲染。
const [searchIsOpen, setSearchIsOpen] = useState(false);
const search = () => {
setSearchIsOpen(!searchIsOpen);
};
<button onClick={search} className="absolute md:left-8 left-3 lg:left-2 top-6 md:top-8 cursor-pointer"></button>
{
searchIsOpen && <div>
<input type="text" name="" id="" />
</div>
}
uj5u.com熱心網友回復：
<div>
{ searchIsOpen && <input type="text" name="" id="" /> }
</div>
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/497765.html
標籤：javascript 反应 下一个.js 模态对话 钩
上一篇：如何在物件陣列中求和javascript陣列的屬性的總和？
下一篇：單擊影像時需要顯示隱藏文本