Question 77040 in Flutter Question posted in
The official Flutter documentation can be found here.

Changes in Object from Second Screen is also Changing the Value in First Screen in flutter dart

A class Object passing from First Screen to the second Screen While on the second screen when the object changed its value, it’s also changing the value on first screen.

Code of First Screen. (widget.templateModel is an object class that i am passing to the second screen)

Navigator.push(context,MaterialPageRoute(builder: (context) =>
EditEmojiTextTemplateScreen(templateModel: widget.templateModel,));

Code of Second Screen (On the second screen i am receiving the object and when i am changing the value of widget.templateModel it also changing the value on the first screen for a simple understandable code below i changed the value in initState while in the gif i am changing value in TextFormField)

class EditEmojiTextTemplateScreen extends StatefulWidget {
  final TemplateModel templateModel;
  EditEmojiTextTemplateScreen({
    Key? key,
    required this.templateModel,
  }) : super(key: key);

  @override
  State<EditEmojiTextTemplateScreen> createState() =>
      _EditEmojiTextTemplateScreenState();
}

class _EditEmojiTextTemplateScreenState
    extends State<EditEmojiTextTemplateScreen> {
  final SharedPreferences sharedPreferences = sl();
  var txtNameController = TextEditingController();
  var txtColorController = TextEditingController();



  _EditEmojiTextTemplateScreenState();
  @override
  void initState() {
    widget.templateModel.emoji[0].titleTwo = "kdfff"; //here i am changing the value and it also changing the value on first screen and i dont want this behavior of this object
   

    super.initState();
  }

sample of issue

Note: This is happening because of widget variable as mentioned in the documentation but i don’t know how to prevent this behavior.

package:flutter/src/widgets/framework.dart

The current configuration.

A [State] object’s configuration is the corresponding [StatefulWidget] instance. This property is initialized by the framework before calling
[initState]. If the parent updates this location in the tree to a new
widget with the same [runtimeType] and [Widget.key] as the current
configuration, the framework will update this property to refer to the
new widget and then call [didUpdateWidget], passing the old
configuration as an argument.

Tags:

3

Answers


  1. 0

    Now I see what you are trying to do.
    You could initialize a NEW istance of TemplateModel in the InitState of the second screen.

    Then, set the new object’s properties like this (or write a cleaner method to do that):

    newObject.property1 = oldObject.property1;
newObject.property2 = oldObject.property2;
...

    Once the user presses the save button, change oldObject‘s properties again, so that the first page updates.

    You might want to take a look at state management to better understand how to approach this kind of problems.

    Login or Signup to reply.
  2. 0

    As the other answer suggests, take a look at state management solutions.
    Also keep the models immutable by creating them with final fields. Then to modify, create new instances via copyWith()

    Login or Signup to reply.
  3. 0

    Please update you code after navigation.then method

     template = snapshot.data;
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search