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:

jsxfunction 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:

jsxfunction 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:

jsxfunction 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:

jsxfunction 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>;
}