flutter - Flutter FutureBuilder 使用 Supabase 查询

Question

我无法让 Supabase 查询与颤振一起工作。以下是代码示例：

child: FutureBuilder<PostgrestResponse<dynamic>>(
   future: supabase.from('products').select().execute(),
      builder: (context, snapshot) {
         if (snapshot.connectionState != ConnectionState.active) {
            return const Center(
               child: SizedBox(
                  child: CircularProgressIndicator(),
                      width: 60,
                      height: 60,
                  ),
               );
            } else {
               return GridView.builder(
                  gridDelegate:
                      SliverGridDelegateWithFixedCrossAxisCount(
                        crossAxisCount: gridColumns,
                        crossAxisSpacing: 10,
                        mainAxisSpacing: 10,
                      ),
                      itemCount: snapshot.data!.length, // this line is causing an error
                      ...

我不知道如何改变快照的长度。就是把它变成流构建器它会起作用。所以我真正想要的只是一个使用带有 supbase 的 futurebuilder 的基本示例。

Answer 1

您可以使用if (snapshot.hasData)而不是检查快照连接状态。因为它不包括任何数据并且连接状态不是活动的。

因此，您可以将代码更改为；

child: FutureBuilder<PostgrestResponse<dynamic>>(
   future: supabase.from('products').select().execute(),
      builder: (context, snapshot) {
         if (!snapshot.hasData) {
            return const Center(
               child: SizedBox(
                  child: CircularProgressIndicator(),
                      width: 60,
                      height: 60,
                  ),
               );
            } else {
               return GridView.builder(
                  gridDelegate:
                      SliverGridDelegateWithFixedCrossAxisCount(
                        crossAxisCount: gridColumns,
                        crossAxisSpacing: 10,
                        mainAxisSpacing: 10,
                      ),
                      itemCount: snapshot.data!.length, // this line is causing an error
                      ...