我是flutter初学者,使用dart语言。我尝试使用GetX在Flutter中集成一个API和UI。我创建了Json类和产品控件。当我尝试创建产品列表视图时,我收到以下错误。
先谢了!
错误行:
1. itemCount: productController.productList.length,
2. productController.productList[index].imageLink,
3. productController.productList[index].title,
错误:
1.没有为类型"Rx"定义getter "length"。
1.没有为类型"Rx"定义运算符"[]"。
1.没有为类型"Rx"定义运算符"[]"。
产品列表代码:
import 'package:flutter/material.dart';
import 'package:practice/commonmodule/AppColor.dart';
import 'package:practice/commonmodule/AppString.dart';
import 'package:practice/productmodule/controllers/product_controller.dart';
import 'package:get/get.dart';
class ProductListView extends StatelessWidget {
final ProductController productController = Get.put(ProductController());
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(AppString.productList),
),
body: Obx(
() {
if (productController.isLoading.value)
return Center(child: CircularProgressIndicator());
else
return ListView.builder(
itemCount: productController.productList.length,
itemBuilder: (context, index) {
return Column(
children: [
Row(
children: [
Container(
width: 150,
height: 100,
margin: EdgeInsets.fromLTRB(16, 8, 8, 8),
child: ClipRRect(
borderRadius: BorderRadius.circular(8),
child: Image.network(
productController.productList[index].imageLink,
width: 150,
height: 100,
fit: BoxFit.fill,
color: AppColor.bluecolor,
colorBlendMode: BlendMode.color,
),
),
),
Flexible(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
productController.productList[index].title,
style: TextStyle(fontSize: 18),
),
Text(
productController.productList[index].description,
style:
TextStyle(fontSize: 18, color: AppColor.grey),
),
Text(
productController.productList[index].price,
style:
TextStyle(fontSize: 18, color: AppColor.grey),
),
],
)),
],
),
Container(
color: AppColor.grey200,
height: 2,
)
],
);
},
);
},
),
);
}
}
产品控制器代码:
class ProductController extends GetxController {
var isLoading = true.obs;
var productList = ProductModel().obs;
@override
void onInit() {
fetchProducts();
super.onInit();
}
void fetchProducts() async {
try {
isLoading(true);
var products = await ApiService.fetchProducts();
if (products != null) {
productList.value = products;
}
} finally {
isLoading(false);
}
}
}
'
1条答案
按热度按时间k10s72fa1#
您需要创建产品列表模型到列表模型。
}