问题描述
我的目标是使用 yyyy-MM-dd( )+[R]
,其中包含一个带有徽章的图标,用于显示用户在其购物车中拥有的产品数量;
只有一个地方可以将产品添加到购物车,我称之为 BottomNavigationBar
:
AddToCartRow
在小部件树中 class AddToCartRow extends StatefulWidget {
final productId;
AddToCartRow(this.productId);
@override
_AddToCartRowState createState() => _AddToCartRowState();
}
class _AddToCartRowState extends State<AddToCartRow> {
TextEditingController _text_controller = TextEditingController();
final CartController cartController = CartController();
int quantity = 1;
@override
void initState() {
super.initState();
_text_controller.text = quantity.toString();
}
void increment() {
setState(() {
quantity += 1;
_text_controller.text = quantity.toString();
});
}
void decrement() {
setState(() {
quantity -= 1;
_text_controller.text = quantity.toString();
});
}
void quantityChanged(val) {
setState(() {
quantity = int.parse(val);
});
}
void addToCart() {
var data = {
"product_id": widget.productId.toString(),"quantity": quantity.toString(),};
cartController.addToCart(data);
}
@override
Widget build(BuildContext context) {
return Obx(
() => Padding(
padding: EdgeInsets.all(10),child: Row(
children: [
// Button
GestureDetector(
child: Container(
height: 50,width: MediaQuery.of(context).size.width / 2 - 15,padding: EdgeInsets.symmetric(vertical: 10,horizontal: 15),decoration: BoxDecoration(
color: CupertinoTheme.of(context).primaryColor,borderRadius: BorderRadius.circular(4),),child: Row(
mainAxisAlignment: MainAxisAlignment.center,children: [
Text(
"ADD TO CART ",style: TextStyle(color: CupertinoColors.white),Icon(
CupertinoIcons.bag,color: CupertinoColors.white,)
],onTap: addToCart),SizedBox(
width: 10,child: Padding(
padding: const EdgeInsets.only(left: 15),child: cartController.modifying.value == true
? CupertinoActivityIndicator()
: Container(),// Count
Container(
width: MediaQuery.of(context).size.width / 2 - 15,child: Row(
mainAxisAlignment: MainAxisAlignment.end,children: [
Container(
height: 50,child: Row(
children: [
Container(
alignment: Alignment.center,decoration: BoxDecoration(
color: CupertinoColors.white,borderRadius: BorderRadius.only(
topLeft: Radius.circular(4),bottomLeft: Radius.circular(4),width: 50,height: 50,child: CupertinoButton(
padding: EdgeInsets.zero,child: Icon(CupertinoIcons.minus),onPressed: decrement),Container(
width: 50,decoration: BoxDecoration(
color: CupertinoColors.white,alignment: Alignment.center,child: CupertinoTextField(
controller: _text_controller,textAlign: TextAlign.center,onChanged: quantityChanged,style: TextStyle(
fontSize: 25,color: CupertinoColors.secondaryLabel),decoration: BoxDecoration(
borderRadius: BorderRadius.zero,color: CupertinoColors.white),)),Container(
alignment: Alignment.center,borderRadius: BorderRadius.only(
topRight: Radius.circular(4),bottomRight: Radius.circular(4),child: Icon(CupertinoIcons.plus),onPressed: increment),)
],],)
],);
}
}
上方的 BottomNavigationBar
中有一个地方可以查看产品数量(在购物车中):
AddToCartRow
和 BottomNavigationBarItem(
icon: Obx(
() => Stack(
alignment: Alignment.topRight,children: [
Icon(CupertinoIcons.bag),Container(
decoration: BoxDecoration(
color: cartController.loading.value == true
? CupertinoColors.white
: CupertinoTheme.of(context).primaryColor,borderRadius: BorderRadius.circular(10),width: 20,height: 20,child: cartController.loading.value == true
? CupertinoActivityIndicator()
: Text(
cartController.cartProductsCont.toString(),style: TextStyle(
color: CupertinoColors.white,fontWeight: FontWeight.bold),)
],activeIcon: Icon(CupertinoIcons.bag_fill),label: 'Cart',
:
CartControllerClass
当我第一次从包含 class CartController extends GetxController {
var cartProducts = [].obs;
var cartProductsCont = 0.obs;
var emptyCart = true.obs;
var loading = true.obs;
var modifying = false.obs;
void getCart() async {
var response = await api.getCart();
response = response.data;
if (response["data"].length == 0) {
emptyCart.value = true;
cartProducts.clear();
} else {
emptyCart.value = false;
cartProducts.assignAll(response["data"]["products"]);
cartProductsCont.value = cartProducts.length;
}
loading.value = false;
modifying.value = false;
}
void addToCart(data) async {
loading.value = true;
modifying.value = true;
await api.addProductToCart(data).then((value) => getCart());
}}
的小部件调用 getCart
时,一切都很好,但是当我从 BottomNavigatioBar
调用 getCart
时,没有发生任何事情,为什么?
解决方法
您的 State 类没有使用 Get.put()
class _AddToCartRowState extends State<AddToCartRow> {
TextEditingController _text_controller = TextEditingController();
final CartController cartController = CartController();
int quantity = 1;
Get.put(CartController())
class _AddToCartRowState extends State<AddToCartRow> {
TextEditingController _text_controller = TextEditingController();
final CartController cartController = Get.put(CartController());
// You're missing a Get.put which Get ↑↑↑↑ needs to track
int quantity = 1;
}