रिएक्ट में स्टेट में बूलियन मान

आइए एक स्टेट 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>;
}