Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/21.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 购物车项目的布尔值在刷新时消失_Javascript_Reactjs - Fatal编程技术网

Javascript 购物车项目的布尔值在刷新时消失

Javascript 购物车项目的布尔值在刷新时消失,javascript,reactjs,Javascript,Reactjs,将产品添加到购物车时,即使其已刷新,其也会存储在localStorage中,但是,Inbot按钮重置为值。简言之,当通过单击购物车按钮添加项目时,Inbot设置为true并显示Inbot文本以禁用该按钮,但当浏览器刷新时,Inbot设置为false并再次显示购物车按钮。我已经在localStorage中存储了购物车的所有信息。请参见下面的代码 Product.js 下面是Envot的代码 <button className="cart-btn" disabled={inCart?true:

将产品添加到购物车时,即使其已刷新,其也会存储在localStorage中,但是,Inbot按钮重置为值。简言之,当通过单击购物车按钮添加项目时,Inbot设置为true并显示Inbot文本以禁用该按钮,但当浏览器刷新时,Inbot设置为false并再次显示购物车按钮。我已经在localStorage中存储了购物车的所有信息。请参见下面的代码

Product.js 下面是Envot的代码

<button className="cart-btn" disabled={inCart?true:false}
        onClick={() => {value.addToCart(id)}}>
        {inCart ? (
            <p className="text-capitalize mb-0" disabled>
            {" "}
            In Cart</p>
        ) : (
            <i className="fas fa-shopping-cart"/>
        )}
</button>
localStorage“myCart”值

0: {id: 1, title: "Google Pixel 3 XL", img: "/static/media/product-1.c7704d10.png", price: 799,…}
company: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAfQA"
count: 1
id: 1
img: "/static/media/product-1.c7704d10.png"
inCart: true
info: "Lorem ipsum dolor amet offal butcher quinoa sustainable gastropub, echo park actually green juice sriracha paleo. Brooklyn sriracha semiotics, DIY coloring book mixtape craft beer sartorial hella blue bottle. Tote bag wolf authentic try-hard put a bird on it mumblecore. Unicorn lumbersexual master cleanse blog hella VHS, vaporware sartorial church-key cardigan single-origin coffee lo-fi organic asymmetrical. Taxidermy semiotics celiac stumptown scenester normcore, ethical helvetica photo booth gentrify."
price: 799
title: "Google Pixel 3 XL"
total: 799

如上所述,在localStorage中,即使刷新了浏览器,也会存储Invout的布尔值。如何在产品的按钮组件中设置值,以便在产品进入购物车之前“在购物车中”保持不变?

对于要“反应”的产品,Invot应该是一个道具或状态的一部分,并用this.props.invot或this.state.invot引用。

按钮中定义了Invot的位置?Invot是一个布尔值这是react吗?因为,为了让它“反应”,化身应该是一个道具或状态的一部分,并用this.props.incontrat或this.state.incontrat.Yes引用它的反应。。。布尔值设置为true,如果为false,则按钮将禁用,反之亦然,除非其状态的一部分不会存储在localstorage中。。。对吗?本地存储是独立的,但如果componentDidMount中的状态不是null或未定义,则可以从中更新状态。还可以从状态写入本地存储。
0: {id: 1, title: "Google Pixel 3 XL", img: "/static/media/product-1.c7704d10.png", price: 799,…}
company: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAfQA"
count: 1
id: 1
img: "/static/media/product-1.c7704d10.png"
inCart: true
info: "Lorem ipsum dolor amet offal butcher quinoa sustainable gastropub, echo park actually green juice sriracha paleo. Brooklyn sriracha semiotics, DIY coloring book mixtape craft beer sartorial hella blue bottle. Tote bag wolf authentic try-hard put a bird on it mumblecore. Unicorn lumbersexual master cleanse blog hella VHS, vaporware sartorial church-key cardigan single-origin coffee lo-fi organic asymmetrical. Taxidermy semiotics celiac stumptown scenester normcore, ethical helvetica photo booth gentrify."
price: 799
title: "Google Pixel 3 XL"
total: 799