Flutter开发BMI计算器时出现setState调用时机错误求助
问题排查与解决
错误根源
你的问题出在ReusableCard组件的GestureDetector的onTap属性上:
onTap: onPress(),
这里的onPress()是立即执行函数,会在ReusableCard构建过程中直接调用传入的onPress方法(也就是包含setState的匿名函数),而Flutter禁止在组件构建期间调用setState(),因此触发了这个断言错误。
修复步骤
- 修改
onTap的赋值方式:将onPress()改为onPress,传递函数引用而非立即执行函数。 - 规范函数类型(可选但推荐):将
ReusableCard的onPress参数类型从Function改为VoidCallback,这是Flutter中无参无返回值回调的标准类型。
修改后的ReusableCard代码
import 'package:flutter/material.dart'; class ReusableCard extends StatelessWidget { final Color color; final Widget cardChild; final VoidCallback onPress; // 改为VoidCallback更规范 const ReusableCard({ super.key, required this.color, this.cardChild = const SizedBox(), required this.onPress, }); @override Widget build(BuildContext context) { return Expanded( child: GestureDetector( onTap: onPress, // 这里去掉括号,传递函数引用 child: Container( margin: const EdgeInsets.all(15.0), height: 205.0, width: 175.0, decoration: BoxDecoration( color: color, borderRadius: BorderRadius.circular(10.0), ), child: cardChild, ), ), ); } }
验证效果
修改后,onPress只会在用户点击卡片时才会被调用,此时组件已经完成构建,调用setState()就不会再触发构建期间的断言错误,性别切换的逻辑也能正常工作。
内容的提问来源于stack exchange,提问作者Gilles Ashley
相关产品推荐
相关产品推荐

