React-এ স্টেটে বুলিয়ান মান

আসুন একটি inCart স্টেট তৈরি করি, যা পণ্যটি কার্টে আছে কি না তা দেখাবে:

jsxfunction App() {
  const [inCart, setInCart] = useState(false);
  
  return <div>
    
  </div>;
}

ধরা যাক false মানের অর্থ হল পণ্য কার্টে নেই, এবং true মানের অর্থ হল কার্টে আছে। টারনারি অপারেটর ব্যবহার করে এ সম্পর্কে তথ্য প্রদর্শন করা যাক:

jsxfunction App() {
  const [inCart, setInCart] = useState(false);
  
  return <div>
    <span>{inCart ? 'কার্টে আছে' : 'কার্টে নেই'}</span>
  </div>;
}

এবার একটি বাটন তৈরি করি, যাতে ক্লিক করলে পণ্যটি কার্টে যোগ হবে:

jsxfunction App() {
  const [inCart, setInCart] = useState(false);
  
  return <div>
    <span>{inCart ? 'কার্টে আছে' : 'কার্টে নেই'}</span>
    <button onClick={() => setInCart(true)}>btn</button>
  </div>;
}

আমাদের কোডটি এমনভাবে পরিবর্তন করি যাতে প্রথম ক্লিক কার্টে যোগ করে, এবং দ্বিতীয় ক্লিক এটি থেকে সরিয়ে দেয়:

jsxfunction App() {
  const [inCart, setInCart] = useState(false);
  
  return <div>
    <span>{inCart ? 'কার্টে আছে' : 'কার্টে নেই'}</span>
    <button onClick={() => setInCart(!inCart)}>btn</button>
  </div>;
}