Flutter升级后PopScope类型错误及筛选器结果传递失败问题

1. 修复PopScope类型错误 #

Flutter 3.24+ 版本中，PopScope的onPopInvoked参数类型已从void Function(bool)变更为PopInvokedWithResultCallback<T?>，该回调需要接收两个参数：bool didPop（标识页面是否成功弹出）和T? result（页面返回的结果）。你需要调整回调签名以匹配新类型：

错误代码示例（原写法） #

PopScope(
  onPopInvoked: (didPop) {
    // 原有业务逻辑
  },
  child: ...,
)

修正后的代码 #

如果不需要使用result参数，可通过下划线忽略：

PopScope(
  onPopInvoked: (didPop, _) {
    // 保留你的原有业务逻辑，比如保存筛选设置
    if (didPop) {
      // 页面已完成弹出，可在此处理后续逻辑
    }
  },
  child: ...,
)

2. 实现筛选结果回传至TabsScreen #

要将修改后的筛选设置传递回TabsScreen，需结合Navigator.pop携带参数，并在TabsScreen中接收返回值，同时通过PopScope确保系统返回键触发时也能传递结果：

步骤1：在FiltersScreen中处理弹出逻辑 #

在用户点击保存按钮或系统触发返回时，调用Navigator.pop传递筛选数据：

// 假设你的筛选设置存储为Map类型
void _saveFiltersAndPop() {
  final updatedFilters = {
    'glutenFree': _glutenFree,
    'lactoseFree': _lactoseFree,
    // 其他筛选项
  };
  Navigator.pop(context, updatedFilters);
}

// 在PopScope中处理系统返回键
PopScope(
  onPopInvoked: (didPop, _) {
    if (!didPop) {
      // 系统触发返回时，主动传递筛选结果
      _saveFiltersAndPop();
    }
  },
  child: Scaffold(
    appBar: AppBar(
      actions: [
        // 手动保存按钮
        IconButton(icon: const Icon(Icons.save), onPressed: _saveFiltersAndPop),
      ],
    ),
    // 筛选控件布局...
  ),
)

步骤2：在TabsScreen中接收返回结果 #

打开FiltersScreen时，通过await Navigator.push接收返回的筛选数据并更新状态：

// 在TabsScreen中触发打开筛选页的逻辑
final updatedFilters = await Navigator.push<Map<String, bool>>(
  context,
  MaterialPageRoute(
    builder: (ctx) => FiltersScreen(currentFilters: _currentFilters),
  ),
);

if (updatedFilters != null) {
  setState(() {
    _currentFilters = updatedFilters;
    // 可选：将筛选设置保存到本地存储（如SharedPreferences）
  });
}

3. 完整核心代码示例 #

FiltersScreen代码 #

class FiltersScreen extends StatefulWidget {
  final Map<String, bool> currentFilters;

  const FiltersScreen({super.key, required this.currentFilters});

  @override
  State<FiltersScreen> createState() => _FiltersScreenState();
}

class _FiltersScreenState extends State<FiltersScreen> {
  late bool _glutenFree;
  late bool _lactoseFree;

  @override
  void initState() {
    super.initState();
    _glutenFree = widget.currentFilters['glutenFree'] ?? false;
    _lactoseFree = widget.currentFilters['lactoseFree'] ?? false;
  }

  void _saveAndPop() {
    final newFilters = {
      'glutenFree': _glutenFree,
      'lactoseFree': _lactoseFree,
    };
    Navigator.pop(context, newFilters);
  }

  @override
  Widget build(BuildContext context) {
    return PopScope(
      onPopInvoked: (didPop, _) {
        if (!didPop) _saveAndPop();
      },
      child: Scaffold(
        appBar: AppBar(
          title: const Text('筛选设置'),
          actions: [IconButton(icon: const Icon(Icons.save), onPressed: _saveAndPop)],
        ),
        body: Column(
          children: [
            SwitchListTile(
              title: const Text('无麸质'),
              value: _glutenFree,
              onChanged: (val) => setState(() => _glutenFree = val),
            ),
            SwitchListTile(
              title: const Text('无乳糖'),
              value: _lactoseFree,
              onChanged: (val) => setState(() => _lactoseFree = val),
            ),
          ],
        ),
      ),
    );
  }
}

TabsScreen中打开筛选页的代码 #

// 假设TabsScreen内的触发按钮
IconButton(
  icon: const Icon(Icons.filter_alt),
  onPressed: () async {
    final result = await Navigator.push<Map<String, bool>>(
      context,
      MaterialPageRoute(builder: (ctx) => FiltersScreen(currentFilters: _currentFilters)),
    );
    if (result != null) {
      setState(() => _currentFilters = result);
      // 可选：SharedPreferences.getInstance().then((prefs) => prefs.setString('filters', jsonEncode(result)));
    }
  },
)

内容的提问来源于stack exchange，提问作者DapPohY