Riverpod技术问题：应用目录PDF列表展示及Provider拆分咨询

一、Provider核心问题修复 #

你的代码存在3个关键问题：

1. 未通过state更新状态，UI无法感知文件列表变化
2. 未主动调用listOfFiles加载文件
3. 未过滤PDF文件，且状态类型不明确

修复后的Provider代码：

import 'dart:io' as io;
import 'package:path_provider/path_provider.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

// 全局状态Provider，明确状态类型为FileSystemEntity列表
final fileListProvider = StateNotifierProvider<BookProvider, List<io.FileSystemEntity>>((ref) {
  final provider = BookProvider();
  provider.listOfFiles(); // 初始化时自动加载文件
  return provider;
});

class BookProvider extends StateNotifier<List<io.FileSystemEntity>> {
  BookProvider() : super([]); // 初始状态为空列表

  Future<void> listOfFiles() async {
    // 获取应用文档目录
    final dirPath = (await getApplicationDocumentsDirectory()).path;
    // 遍历目录并过滤PDF文件
    final pdfFiles = io.Directory(dirPath)
        .listSync()
        .where((entity) => entity.path.toLowerCase().endsWith('.pdf'))
        .toList();
    // 更新state，通知UI刷新
    state = pdfFiles;
  }
}

二、Widget部分优化 #

需要处理文件/目录的类型判断，避免非文件实体导致的错误：

import 'dart:io' as io;
import 'package:path/path.dart' as path;
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

class BookListView extends StatelessWidget {
  const BookListView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Expanded(
      child: Consumer(
        builder: (context, ref, _) {
          final files = ref.watch(fileListProvider);

          // 空状态处理
          if (files.isEmpty) {
            return const Center(child: Text('未找到PDF文件'));
          }

          return GridView.builder(
            gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(
              maxCrossAxisExtent: 200,
              childAspectRatio: 2 / 3,
              crossAxisSpacing: 20,
              mainAxisSpacing: 20,
            ),
            itemCount: files.length,
            itemBuilder: (ctx, index) {
              final entity = files[index];
              // 仅处理文件类型，跳过目录
              if (entity is io.File) {
                final bookName = path.basename(entity.path);
                return BookListItem(bookName: bookName);
              }
              return const SizedBox.shrink();
            },
          );
        },
      ),
    );
  }
}

// 示例BookListItem组件
class BookListItem extends StatelessWidget {
  final String bookName;
  const BookListItem({Key? key, required this.bookName}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.all(8),
      decoration: BoxDecoration(
        border: Border.all(color: Colors.grey.shade300),
        borderRadius: BorderRadius.circular(8),
      ),
      child: Text(bookName, textAlign: TextAlign.center),
    );
  }
}

三、Provider拆分到独立文件的方案 #

Riverpod的设计核心就是全局Provider变量，无需将其放到类中。拆分步骤：

1. 创建独立文件（比如book_provider.dart）
2. 将fileListProvider和BookProvider全部移到这个文件中
3. 在需要使用的Widget文件中导入该文件，直接通过ref.watch(fileListProvider)访问

如果非要在类中关联Provider（不推荐），可以添加静态 getter，但这属于冗余操作：

class BookProvider extends StateNotifier<List<io.FileSystemEntity>> {
  // ... 其他代码

  // 静态方法返回全局Provider，仅用于类关联，实际直接用全局变量更方便
  static StateNotifierProvider<BookProvider, List<io.FileSystemEntity>> get provider => fileListProvider;
}

内容的提问来源于stack exchange，提问作者Ziad H.