Middle
Valósítson meg keresési és szűrő funkciót egy React komponensben useState használatával. - Használja a useState-et keresési állapot és szerepkör szűrő állapot létrehozásához. - Kösse a keresési állapotot egy bemeneti mező értékéhez, és frissítse változáskor. - Kösse a szerepkör szűrő állapotot egy kiválasztó legördülő értékéhez, és frissítse változáskor. - Stílusozza a bemeneti mezőt paddinggal és betűmérettel.
sobes.tech MI
Válasz az MI-től
jsx import React, { useState } from 'react';
function SearchFilterComponent() { const [search, setSearch] = useState(''); const [roleFilter, setRoleFilter] = useState('');
return ( <div> <input type="text" value={search} onChange={e => setSearch(e.target.value)} placeholder="Keresés..." style={{ padding: '8px', fontSize: '16px' }} />
<select
value={roleFilter}
onChange={e => setRoleFilter(e.target.value)}
>
<option value="">Minden szerep</option>
<option value="admin">Adminisztrátor</option>
<option value="user">Felhasználó</option>
<option value="guest">Vendég</option>
</select>
{/* Itt hozzáadhatja a szűrt adatok megjelenítésének logikáját */}
</div>
); }
export default SearchFilterComponent;