flutter - 模型类在不应该更新的时候更新

Question

当我不想...时，我不知道如何防止模型类更新...我将模型类传递到包含数字的模式中。我正在更新那里的数字，如果我决定关闭模态而不保存，那么我希望主屏幕中的数字保持不变，所以当我重新打开模态时，数字会恢复到更新前的状态。不过，不管我存不存，号码都存了。

这是一个简单的复制粘贴示例

class MaterialScreen extends StatefulWidget {
  @override
  _MaterialScreenState createState() => _MaterialScreenState();
}

NumberClass myNumber = NumberClass(0);

class _MaterialScreenState extends State<MaterialScreen> {
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: FlatButton(
          child: Text('Open'),
          onPressed: () async {
            NumberClass n = await showModalBottomSheet(
              context: context,
              builder: (_) => Modal(
                number: myNumber,
              ),
            );
            if (n != null) {
              setState(() {
                myNumber = n;
              });
            }
          },
        ),
      ),
    );
  }
}

class Modal extends StatefulWidget {
  final NumberClass number;

  const Modal({this.number});

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

NumberClass _newNumber;

class _ModalState extends State<Modal> {
  @override
  void initState() {
    _newNumber = widget.number;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: <Widget>[
        Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(_newNumber.number.toString()),
            FlatButton(
              child: Text('Update'),
              onPressed: () {
                setState(() {
                  _newNumber.number =
                      _newNumber.number + 1; // update only newNumber
                });
                print(_newNumber.number);
                print(widget.number.number); // <== updating when it should not
              },
            )
          ],
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: <Widget>[
            OutlineButton(
              child: Text('close - dont save'),
              onPressed: () => Navigator.pop(context),
            ),
            OutlineButton(
              child: Text('close - save'),
              onPressed: () => Navigator.pop(context, _newNumber),
            ),
          ],
        )
      ],
    );
  }
}

class NumberClass {
  int number;

  NumberClass(this.number);
}

Answer 1

这是解决方案，但不是很好。有一个克隆类的选项肯定会很好。

将您的 NumberClass 更改为

class NumberClass {
  int number;

  NumberClass({this.number});

  Map<String, dynamic> toMap() {
    return {'number': number};
  }

  factory NumberClass.fromMap(Map<String, dynamic> data) {
    if (data == null) {
      return null;
    }
    final int number = data['number'];
    return NumberClass(number: number);
  }
}

创建一个克隆并将其传递给您的模态类

       onPressed: () async {
        Map numberMap = myNumber.toMap();
        NumberClass clone = NumberClass.fromMap(numberMap);
        NumberClass n = await showModalBottomSheet(
          context: context,
          builder: (_) => Modal(
            data: clone,
          ),
        );

完整代码

class MaterialScreen extends StatefulWidget {
  @override
  _MaterialScreenState createState() => _MaterialScreenState();
}

NumberClass myNumber = NumberClass(number: 0);

class _MaterialScreenState extends State<MaterialScreen> {
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: FlatButton(
          child: Text('Open'),
          onPressed: () async {
            Map numberMap = myNumber.toMap();
            NumberClass clone = NumberClass.fromMap(numberMap);
            NumberClass n = await showModalBottomSheet(
              context: context,
              builder: (_) => Modal(
                data: clone,
              ),
            );
            if (n != null) {
              setState(() {
                myNumber = n;
              });
            }
          },
        ),
      ),
    );
  }
}

class Modal extends StatefulWidget {
  final NumberClass data;

  const Modal({this.data});

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

NumberClass _newNumber;

class _ModalState extends State<Modal> {
  @override
  void initState() {
    _newNumber = widget.data;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: <Widget>[
        Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(_newNumber.number.toString()),
            FlatButton(
              child: Text('Update'),
              onPressed: () {
                setState(() {
                  _newNumber.number =
                      _newNumber.number + 1; // updating only newNumber
                });
              },
            )
          ],
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: <Widget>[
            OutlineButton(
              child: Text('close - dont save'),
              onPressed: () => Navigator.pop(context),
            ),
            OutlineButton(
              child: Text('close - save'),
              onPressed: () => Navigator.pop(context, _newNumber),
            ),
          ],
        )
      ],
    );
  }
}

class NumberClass {
  int number;

  NumberClass({this.number});

  Map<String, dynamic> toMap() {
    return {'number': number};
  }

  factory NumberClass.fromMap(Map<String, dynamic> data) {
    if (data == null) {
      return null;
    }
    final int number = data['number'];
    return NumberClass(number: number);
  }
}