React-də State-də Məntiqi Qiymət
Gəlin, məhsulun səbətdə olub-olmadığını göstərən
inCart state-ni yaradaq:
function App() {
const [inCart, setInCart] = useState(false);
return <div>
</div>;
}
false qiyməti məhsulun səbətdə olmadığını,
true qiyməti isə səbətdə olduğunu bildirsin.
Bu barədə məlumatı üçlü operator vasitəsilə çıxadaq:
function App() {
const [inCart, setInCart] = useState(false);
return <div>
<span>{inCart ? 'səbətdədir' : 'səbətdə deyil'}</span>
</div>;
}
İndi isə kliklənədiyində məhsulu səbətə əlavə edən bir düymə edək:
function App() {
const [inCart, setInCart] = useState(false);
return <div>
<span>{inCart ? 'səbətdədir' : 'səbətdə deyil'}</span>
<button onClick={() => setInCart(true)}>düymə</button>
</div>;
}
Kodumuzu elə dəyişək ki, düyməyə birinci klik məhsulu səbətə əlavə etsin, ikinci klik isə səbətdən çıxartsın:
function App() {
const [inCart, setInCart] = useState(false);
return <div>
<span>{inCart ? 'səbətdədir' : 'səbətdə deyil'}</span>
<button onClick={() => setInCart(!inCart)}>düymə</button>
</div>;
}
İstifadəçini ban edən və istifadəçinin banını açan bir düymə edin.
Əvvəlki məsələni elə dəyişin ki, iki düymədən həmişə yalnız müvafiq olanı görünsün. Yəni, əgər istifadəçi banlanıbsa, onun banını açmaq üçün düymə görünsün, əgər banlanmayıbsa, banlamaq üçün düymə görünsün.