Flutter中setState无法更新内部自定义Stateful组件问题

你的问题核心是当父组件的selectionsList变化时，自定义组件没有重新生成标签页的内容。原因很明确：initState只会在组件第一次初始化时执行一次，后续父组件传递新的selectionsList时，你没有在didUpdateWidget里更新tabWidget这个核心的标签映射。

具体修改步骤： #

1. 重构标签生成逻辑：把生成标签的代码提取成独立方法，初始化和更新时都能复用，避免重复代码。
2. 完善didUpdateWidget方法：当新旧selectionsList不一致时，重新生成tabWidget，同时调整选中索引（防止新列表长度变短，导致选中索引越界）。
3. 移除冗余代码：initState里直接赋值即可，不需要额外调用setState。

修改后的SegmentsWidget代码： #

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class SegmentsWidget extends StatefulWidget {
  final List selectionsList;
  final ValueChanged<int> onSelectTab;
  final int selectedValue;

  SegmentsWidget({
    this.selectionsList,
    this.onSelectTab,
    this.selectedValue,
  });

  @override
  _SegmentsWidgetState createState() => _SegmentsWidgetState();
}

class _SegmentsWidgetState extends State<SegmentsWidget> {
  Map<int, Widget> tabWidget = Map<int, Widget>();
  int selectedTab = 0;

  @override
  void initState() {
    super.initState();
    _generateTabWidgets(); // 初始化阶段生成标签
  }

  @override
  void didUpdateWidget(SegmentsWidget oldWidget) {
    super.didUpdateWidget(oldWidget);
    // 仅当列表内容真正变化时，才重新生成标签
    if (widget.selectionsList != oldWidget.selectionsList) {
      _generateTabWidgets();
      // 处理选中索引越界的情况
      if (selectedTab >= widget.selectionsList.length) {
        setState(() {
          selectedTab = widget.selectionsList.length - 1;
        });
        widget.onSelectTab?.call(selectedTab);
      }
    }
  }

  // 提取生成标签的复用方法
  void _generateTabWidgets() {
    setState(() {
      tabWidget.clear();
      widget.selectionsList.asMap().forEach((index, value) {
        tabWidget.addAll({
          index: Container(
            height: 40,
            child: Center(
              child: Text(
                widget.selectionsList[index],
                style: TextStyle(fontFamily: 'Exo2', fontSize: 12.0),
              ),
            ),
          ),
        });
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Row(
        children: <Widget>[
          Expanded(
            child: SizedBox(
              width: MediaQuery.of(context).size.width,
              child: CupertinoSegmentedControl<int>(
                padding: EdgeInsets.symmetric(vertical: 8),
                children: tabWidget,
                onValueChanged: (int index) {
                  setState(() {
                    selectedTab = index;
                  });
                  widget.onSelectTab?.call(index);
                },
                groupValue: widget.selectedValue ?? selectedTab,
              ),
            ),
          )
        ],
      ),
    );
  }
}

额外优化说明： #

• 移除了未使用的onTap参数，若有需求可自行加回；
• 使用?.call()做空安全调用，避免onSelectTab为null时触发错误；
• 增加列表变化判断，避免无意义的组件重绘。

修改完成后，点击HomePage中的按钮更新selection列表时，SegmentsWidget会自动同步生成对应的新标签页，实现实时更新效果。

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