Flutter中Switch Case修改其他分支状态时Widget不重建求助
问题描述
以下是相关Dart代码:
int __respiratoryRate=0; _buildWidget( PatientModel? patientModel, cardioVascularWidget, BuildContext context, ) { switch (cardioVascularWidget.key) { case 'respiratoryRate': VitalComponent? respiratoryRate = widget .cardiovascularFormModel?.cardiovascularAssessment?.respiratoryRate; return Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ CustomInputTextFormField( titleText: respiratoryRate?.title ?? "", hintText: respiratoryRate?.hintText ?? "", trailingInputUnitText: respiratoryRate?.suffixValue ?? "", isTitleRequired: true, isTitleMandatory: true, onEnteredValue: (value) { setState(() { _respiratoryRate = value == null ? 0 : value.round(); }); }, ), ], ); case 'heartRate': VitalComponent? heartRate = widget.cardiovascularFormModel?.cardiovascularAssessment?.heartRate; return CustomInputTextFormField( titleText: heartRate?.title ?? "", hintText: heartRate?.hintText ?? "", trailingInputUnitText: heartRate?.suffixValue ?? "", isTitleRequired: true, isTitleMandatory: true, onEnteredValue: (value) {}, ); case 'issue': Issue? issue = widget.cardiovascularFormModel?.cardiovascularAssessment?.issue; return Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ TitleMandatoryWidget(isMandatory: false, title: '${issue?.title}'), Text('$_respiratoryRate'), ], ); case 'nursingDiagnosis': NursingDiagnosis? nursingDiagnosis = widget.cardiovascularFormModel?.cardiovascularAssessment?.nursingDiagnosis; return Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ TextWidget( textValue: '${AppLocalizations.of(context)?.nursingDiagnosis}', textStyle: Theme.of(context).textTheme.titleMedium, ), SizedBox(height: AppSizeConstants.size8), SingleSelectionListGridView( title: nursingDiagnosis?.text ?? "", isMandatory: nursingDiagnosis?.mandatory ?? false, isBoldTitle: false, crossCount: nursingDiagnosis?.listview?.columnCount ?? 0, onItemSelection: (value) {}, isOthersSelected: (isSelected) {}, dataList: nursingDiagnosis?.listview?.values ?? [], listGridType: ListGridDisplayType.TEXT_LIST, ), ], ); case 'evaluation': Evaluation? evlnModel = widget.cardiovascularFormModel?.cardiovascularAssessment?.evaluation; return EvaluationWidget( onEvaluationChangedValue: (evlnValue) {}, dataList: evlnModel?.listview?.items ?? [], columnCount: evlnModel?.listview?.columnCount ?? 0, ); default: return SizedBox(); } }
在上述Switch Case结构中,当respiratoryRate分支的CustomInputTextFormField输入值变化时,通过setState修改了_respiratoryRate变量,但issue分支中显示该变量的Text组件未重建更新,请问如何实现该Widget的重建?
解决方案
1. 修正变量名笔误
代码开头定义的是__respiratoryRate(双下划线),但setState赋值和issue分支调用的是_respiratoryRate(单下划线),属于两个独立变量,先统一变量名:
// 修正为单下划线,与后续使用保持一致 int _respiratoryRate = 0;
2. 确保_buildWidget在StatefulWidget的build方法内调用
setState仅会触发当前StatefulWidget的build方法重新执行,因此必须让_buildWidget在build方法内调用,这样每次setState后,_buildWidget会重新执行,issue分支的Text组件就能获取最新的_respiratoryRate值。示例如下:
@override Widget build(BuildContext context) { // 直接在build中调用_buildWidget,而非在initState等位置缓存Widget return _buildWidget(widget.patientModel, widget.cardioVascularWidget, context); }
3. 移除不必要的Widget缓存
如果代码中使用了PageView+AutomaticKeepAliveClientMixin,或手动缓存了_buildWidget返回的Widget,会导致缓存的Widget无法重建。这种情况需要移除缓存逻辑,或者在_respiratoryRate变化时手动触发缓存Widget的更新。
4. 多Widget共存场景的处理
如果respiratoryRate和issue分支的Widget同时显示在界面上,只要确保父Widget的build方法会在setState后重新执行,_buildWidget生成的所有子Widget都会同步更新。
内容的提问来源于stack exchange,提问作者Navin
相关产品推荐
相关产品推荐

