如何使用 Flutter 中的 Provider 增加电子商务购物车中的商品数量
Posted
技术标签:
【中文标题】如何使用 Flutter 中的 Provider 增加电子商务购物车中的商品数量【英文标题】:How to increase items Quantity in E-Commerce Cart using Provider in Flutter 【发布时间】:2020-10-15 04:17:12 【问题描述】:当我点击产品视图中的添加按钮或多次添加到购物车时,我想增加产品数量,但我不增加它的数量保持不变,有人帮我解决了这个问题。如何为项目提供索引?
我正在使用 Provider 进行状态管理
ProviderSpace.dart
import 'dart:collection';
import 'package:flutter/cupertino.dart';
import 'package:flutter/foundation.dart';
class AddItem extends ChangeNotifier
List<Cart> _addNewData = [];
int get newDataCount
return _addNewData.length;
UnmodifiableListView<Cart> get tasks
return UnmodifiableListView(_addNewData);
void addCardManager(String itemName, String assetName, int itemRate,
int quantity, String type)
final newAddItem = Cart(
name: itemName,
type: type,
rate: itemRate,
asset: assetName,
);
_addNewData.add(newAddItem);
notifyListeners();
void updateTask(Cart task)
task.toggleDone();
notifyListeners();
void decrease(Cart task)
task.decreaseDown();
notifyListeners();
void removeCard(Cart task)
_addNewData.remove(task);
notifyListeners();
class Cart
final String name;
final String asset;
final String type;
final int rate;
int quantity;
Cart(
this.name,
this.asset,
this.type,
this.rate,
this.quantity = 1,
);
void toggleDone()
quantity++;
void decreaseDown()
quantity == 0 ? 0 : quantity--;
我需要更新值的代码
changeButtonOnTap
? Container(
width: 80,
height: 25,
child: FlatButton(
onPressed: ()
Provider.of<AddItem>(context, listen: false)
.addCardManager(widget.name, widget.name,
widget.mrp, widget.quantity, widget.type);
setState(()
changeButtonOnTap = false;
);
,
color: Color(0xffFF6200),
child: Text("Add",
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 11,
color: Color(0xffffffff),
)),
),
)
: Container(
height: 25.00,
width: 80,
decoration: BoxDecoration(
color: Color(0xffFF6200),
borderRadius: BorderRadius.circular(30.00),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
GestureDetector(
onTap: () <-----here i need to make change
Provider.of<AddItem>(context, listen: false)
.updateTask(Provider.of<AddItem>(context,
listen: false)
.tasks[0]);
setState(()
value++;
print(Provider.of<AddItem>(context,
listen: false)
.newDataCount);
);
,
child: Icon(Icons.add_circle,
color: Colors.white)),
Text(
value.toString(),
style: TextStyle(color: Colors.white),
),
GestureDetector(
onTap: ()
setState(()
value >= 2 ? value-- : null;
);
,
child: Icon(
Icons.do_not_disturb_on,
color: Colors.white,
),
)
],
),
)
【问题讨论】:
你找到解决办法了吗? @SurajKhanal 我为上述问题添加了我想出的答案......下面的答案完美无缺......我在我的大部分电子商务应用程序购物车中都使用了这个代码 感谢您发布解决方案。 【参考方案1】:以下代码用于增加物品的数量(如果添加相同的物品)
void addCardManager(String itemName, String assetName, int itemRate,
int ogRate, int quantity, String type)
final newAddItem = Cart(
name: itemName,
type: type,
rate: itemRate,
ogPrice: ogRate,
asset: assetName,
);
if (_addNewData.length != 0)
bool isFound = false;
for (int itemcount = 0; itemcount < newDataCount; itemcount++)
if (_addNewData[itemcount].name == newAddItem.name)
print("addCard");
isFound = true;
_addNewData[itemcount].toggleDone();
notifyListeners();
break;
if (!isFound)
_addNewData.add(newAddItem);
notifyListeners();
else
_addNewData.add(newAddItem);
notifyListeners();
void removeCardManager(String itemName, String assetName, int itemRate,
int quantity, String type)
final newAddItem = Cart(
name: itemName,
type: type,
rate: itemRate,
asset: assetName,
);
print(_addNewData);
if (_addNewData.length != 0)
bool isFound = false;
for (int itemcount = 0; itemcount < newDataCount; itemcount++)
if (_addNewData[itemcount].name == newAddItem.name)
print("RemoveCard");
isFound = true;
decrease(_addNewData[itemcount]);
notifyListeners();
break;
作为参考,我将添加链接到上述代码的完整代码
void updateTask(Cart task)
task.toggleDone();
notifyListeners();
void decrease(Cart task)
if (task.quantity == 1)
removeCard(task);
task.decreaseDown();
notifyListeners();
void removeCard(Cart task)
_addNewData.remove(task);
notifyListeners();
class Cart
final String name;
final String asset;
final int ogPrice;
final String type;
final int rate;
int quantity;
Cart(
this.name,
this.ogPrice,
this.asset,
this.type,
this.rate,
this.quantity = 1,
);
void toggleDone()
quantity++;
void decreaseDown()
quantity == 0 ? 0 : quantity--;
【讨论】:
以上是关于如何使用 Flutter 中的 Provider 增加电子商务购物车中的商品数量的主要内容,如果未能解决你的问题,请参考以下文章
如何关闭 ChangeNotifier Provider Flutter 中的函数
如何在flutter的build方法中调用provider中的方法?
如何在 Hot Reload 上使用 Provider 维护 Flutter Global BloC 状态?