Sobes.tech
Middle

Įgyvendinkite paieškos ir filtravimo funkciją React komponentoje naudodami useState. - Naudokite useState, kad sukurtumėte paieškos būseną ir rolės filtro būseną. - Susiekite paieškos būseną su įvesties lauko verte ir atnaujinkite ją keičiant. - Susiekite rolės filtro būseną su pasirinkimo išskleidžiamojo meniu verte ir atnaujinkite ją keičiant. - Stiliuokite įvesties lauką su padding ir šrifto dydžiu.

sobes.tech AI

Atsakymas iš AI

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="Paieška..." style={{ padding: '8px', fontSize: '16px' }} />

  <select
    value={roleFilter}
    onChange={e => setRoleFilter(e.target.value)}
  >
    <option value="">Visi vaidmenys</option>
    <option value="admin">Administratorius</option>
    <option value="user">Vartotojas</option>
    <option value="guest">Svečias</option>
  </select>

  {/* Čia galima pridėti logiką filtruotų duomenų rodymui */}
</div>

); }

export default SearchFilterComponent;