Flutter：如何从子小部件更新子（和父）小部件的 state（父小部件得到更新，子小部件没有）

Question

I have created myself a widget which creates either a form switch with text or just returns the switch. Now I want to use this widget called PlatformSwitch (child) multiple times in my filter (parent).

In order to have to correct selected values in my filter I need to pass the selected values (either true or false ) back to the filter from each switch. I have already tried to solve this but I am simply not able to adapt the solutions from google to my code.

The onChange method gets fired even with the correct value I have selected, however the value passed to the child again is the old value. How can this be?

I already tried to wrap my PlatformSwitch in an Obx from GetX but this leads to the exact same problem. Does anyone know how to update the child value again?

Printed values:

flutter: Selected: false <-- Initialized
flutter: State update: true <-- Updated
flutter: Selected: false <-- Reinitialized with wrong value!

Filter (parent):

class FilterModal extends StatefulWidget {
  const FilterModal({Key? key}) : super(key: key);

  @override
  State<FilterModal> createState() => _FilterModalState();
}

class _FilterModalState extends State<FilterModal> {
  bool showExpiredProducts = false;

  _FilterModalState();

  final FilterController filterController = Get.put(FilterController());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: PlatformSwitch(
          selected: showExpiredProducts,
          onlySwitch: false,
          prefix: "Abgelaufen Angebote anzeigen",
          onChanged: (value) {
            setState(() {
              print("State update: " + value.toString());
              showExpiredProducts = value;
            });
          }),
    );
  }
}

PlatformSwitch (child):

class PlatformSwitch extends StatefulWidget {
  String? prefix;
  bool onlySwitch;
  bool selected;
  ValueChanged onChanged;

  PlatformSwitch(
      {Key? key,
      this.selected = false,
      this.onlySwitch = true,
      this.prefix,
      required this.onChanged})
      : super(key: key);

  @override
  // ignore: no_logic_in_create_state
  _PlatformSwitchState createState() => _PlatformSwitchState(
      selected,
      onlySwitch,
      prefix,
      onChanged);
}

class _PlatformSwitchState extends State<PlatformSwitch> {
  String? prefix;
  bool onlySwitch;
  bool selected;
  ValueChanged onChanged;

  _PlatformSwitchState(
      this.selected,
      this.onlySwitch,
      this.prefix,
      this.onChanged);

  @override
  Widget build(BuildContext context) {
    print("Selected: " + selected.toString());

    if (!onlySwitch) {
      return platformFormRowSwitch();
    }

    return platformSwitch();
  }

  platformFormRowSwitch() {
    return Container(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Column(
              children: [Text(prefix!)],
            ),
            Column(
              children: [platformSwitch()],
            )
          ],
        ));
  }

  platformSwitch() {
    if (defaultTargetPlatform == TargetPlatform.android) {
      return Switch(
        value: selected,
        onChanged: onChanged
      );
    }

    return CupertinoSwitch(
      value: selected,
      onChanged: onChanged,
    );
  }
}

UPDATE!

It seems like I have found a workaround now. I just use widget.selected instead of just selected on my switches within the function platformSwitch . Can anybody tell me why this is working?

Also, is this a correct way of implementing? Whats the correct way?

platformSwitch() {
    if (defaultTargetPlatform == TargetPlatform.android) {
      return Switch(
        value: widget.selected,
        onChanged: onChanged,
        inactiveTrackColor: inactiveTrackColor,
        activeColor: activeColor,
      );
    }

    return CupertinoSwitch(
      value: widget.selected,
      activeColor: activeColor,
      trackColor: inactiveTrackColor,
      onChanged: onChanged,
    );
  }

Kind regards and thank you!

Answer 1

State outlives StatefulWidget . When widget instance is recreated with new parameters, old state instance is kept.

To get updated data in state, you have two options:

• access data from widget using widget.something
• update state's fields in didUpdateWidget