flutter 使用Riverpod显示来自多个API请求的数据

4sup72z8  于 12个月前  发布在  Flutter
关注(0)|答案(3)|浏览(124)

所以我有一个函数,它可以同时获取两个不同的对象模型,但是我在尝试按它们各自的模型显示这些值时遇到了问题。下面是我获取想要显示的数据的地方:

final getProfileAndItem = FutureProvider.family((ref, String uid) async {
  return ref.watch(itemUserProvider).getItemByUser(uid);
});

 Future<(UserTable, ItemModel)> getItemByUser(String uid) async {
    try {
      final value = await Future.wait([
        http.get(Uri.parse('${API.getpurchaseItemByUID}' '?uid=$uid')),
        http.get(Uri.parse('${API.getUserProfileByUID}' '?uid=$uid'))
      ]);

      final item = jsonDecode(value[0].body); 
      final profile = jsonDecode(value[1].body);

      return (UserTable.fromJson(profile[0]), ItemModel.fromJson(item[0]));
    } catch (error) {
      throw error;
    }
  }

下面是我试图显示数据的地方,也是我得到错误的地方,似乎每次我试图通过它所属的模型获取值时,我都会得到The getter isn't defined for the type '(UserTable, itemModel)'.

ref.watch(getProfileAndItem(uid)).when(
              data: (data) => Column(
                  children: [
                    Text(data.userName),//UserTable
                    Text(data.itemName)//ItemModel
                  ],
                ),
              error: (error, stackTrace) => ErrorText(error: error.toString()),
              loading: () => const Loader(),
            ));
bqjvbblv

bqjvbblv1#

由于data是一个Recordtype '(UserTable, itemModel)'),如果你想从ItemModel(记录中的第二个值)中获取userNameitemName,你应该像这样访问它们:

data: (data) => Column(
  children: [
    Text(data.$2.userName),
    Text(data.$2.itemName)
  ],
),
wlp8pajw

wlp8pajw2#

错误提示“getter is not defined for the type (UserTable, itemModel)”是因为您试图直接访问元组(UserTable, ItemModel)的属性,就好像它是某个模型的对象一样。由于元组不是命名对象,因此必须使用索引(例如data.item1data.item2)来访问其属性。以下是如何更改代码以正确访问属性:

ref.watch(getProfileAndItem(uid)).when(
  data: (data) => Column(
    children: [
      Text(data.item1.userName), // Access userName from UserTable
      Text(data.item2.itemName), // Access itemName from ItemModel
    ],
  ),
  error: (error, stackTrace) => ErrorText(error: error.toString()),
  loading: () => const Loader(),
));

data.item1访问元组(UserTable, ItemModel)中的第一项,即UserTable示例,data.item2访问元组中的第二项,即ItemModel示例。

093gszye

093gszye3#

由于您使用的是Record,因此可以使用命名参数访问记录项。例如:

final getProfileAndItem = FutureProvider.family((ref, String uid) async {
  return ref.watch(itemUserProvider).getItemByUser(uid);
});

 Future<({UserTable userTable, ItemModel itemModel})> getItemByUser(String uid) async {
    try {
      final value = await Future.wait([
        http.get(Uri.parse('${API.getpurchaseItemByUID}' '?uid=$uid')),
        http.get(Uri.parse('${API.getUserProfileByUID}' '?uid=$uid'))
      ]);

      final item = jsonDecode(value[0].body); 
      final profile = jsonDecode(value[1].body);

      return (userTable: UserTable.fromJson(profile[0]), itemModel: ItemModel.fromJson(item[0]));
    } catch (error) {
      throw error;
    }
  }

然后你可以使用它作为:

ref.watch(getProfileAndItem(uid)).when(
          data: (data) => Column(
              children: [
                Text(data.userTable.userName),//UserTable
                Text(data.itemModel.itemName)//ItemModel
              ],
            ),
          error: (error, stackTrace) => ErrorText(error: error.toString()),
          loading: () => const Loader(),
        ));

相关问题