บังคับให้ Flutter navigator โหลดสถานะใหม่เมื่อ popping

Question 1

ฉันมีStatefulWidgetปุ่มหนึ่งในปุ่ม Flutter with ซึ่งนำทางฉันไปยังอีกStatefulWidgetปุ่มหนึ่งโดยใช้Navigator.push()ไฟล์. ในวิดเจ็ตที่สองฉันกำลังเปลี่ยนสถานะส่วนกลาง (ค่ากำหนดของผู้ใช้บางอย่าง) เมื่อฉันกลับจากวิดเจ็ตที่สองเป็นวิดเจ็ตแรกการใช้Navigator.pop()วิดเจ็ตแรกอยู่ในสถานะเก่า แต่ฉันต้องการบังคับให้โหลดซ้ำ มีความคิดอย่างไรที่จะทำสิ่งนี้? ฉันมีความคิดอย่างหนึ่ง แต่มันดูน่าเกลียด:

ป๊อปเพื่อลบวิดเจ็ตที่สอง (อันปัจจุบัน)
ป๊อปอีกครั้งเพื่อลบวิดเจ็ตแรก (อันก่อนหน้า)
กดวิดเจ็ตแรก (ควรบังคับให้วาดใหม่)

Question 2

มีสองสามสิ่งที่คุณสามารถทำได้ที่นี่ คำตอบของ @ Mahi ในขณะที่ถูกต้องอาจกระชับกว่าเล็กน้อยและใช้ push มากกว่า showDialog ตามที่ OP กำลังถาม นี่คือตัวอย่างที่ใช้Navigator.push:

import 'package:flutter/material.dart';

class SecondPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Container(
      color: Colors.green,
      child: new Column(
        children: <Widget>[
          new RaisedButton(
            onPressed: () => Navigator.pop(context),
            child: new Text("back"),
          ),
        ],
      ),
    );
  }
}

class FirstPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => new FirstPageState();
}

class FirstPageState extends State<FirstPage> {

  Color color = Colors.white;

  @override
  Widget build(BuildContext context) {
    return new Container(
      color: color,
      child: new Column(
        children: <Widget>[
          new RaisedButton(
              child: new Text("next"),
              onPressed: () {
                Navigator
                    .push(
                  context,
                  new MaterialPageRoute(builder: (context) => new SecondPage()),
                )
                    .then((value) {
                  setState(() {
                    color = color == Colors.white ? Colors.grey : Colors.white;
                  });
                });
              }),
        ],
      ),
    );
  }
}

void main() => runApp(
      new MaterialApp(
        builder: (context, child) => new SafeArea(child: child),
        home: new FirstPage(),
      ),
    );

อย่างไรก็ตามมีอีกวิธีในการทำเช่นนี้ที่อาจเข้ากับกรณีการใช้งานของคุณได้ดี หากคุณใช้globalเป็นสิ่งที่มีผลต่อการสร้างหน้าแรกของคุณคุณสามารถใช้InheritedWidgetเพื่อกำหนดการตั้งค่าผู้ใช้ทั่วโลกของคุณและทุกครั้งที่มีการเปลี่ยนแปลง FirstPage ของคุณจะสร้างใหม่ สิ่งนี้ยังใช้งานได้ภายในวิดเจ็ตไร้สถานะดังที่แสดงด้านล่าง (แต่ควรทำงานในวิดเจ็ตที่มีสถานะเช่นกัน)

ตัวอย่างของ inheritWidget ในการกระพือปีกคือ Theme ของแอปแม้ว่าพวกเขาจะกำหนดมันภายในวิดเจ็ตแทนที่จะสร้างโดยตรงอย่างที่ฉันมีที่นี่

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

class SecondPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Container(
      color: Colors.green,
      child: new Column(
        children: <Widget>[
          new RaisedButton(
            onPressed: () {
              ColorDefinition.of(context).toggleColor();
              Navigator.pop(context);
            },
            child: new Text("back"),
          ),
        ],
      ),
    );
  }
}

class ColorDefinition extends InheritedWidget {
  ColorDefinition({
    Key key,
    @required Widget child,
  }): super(key: key, child: child);

  Color color = Colors.white;

  static ColorDefinition of(BuildContext context) {
    return context.inheritFromWidgetOfExactType(ColorDefinition);
  }

  void toggleColor() {
    color = color == Colors.white ? Colors.grey : Colors.white;
    print("color set to $color");
  }

  @override
  bool updateShouldNotify(ColorDefinition oldWidget) =>
      color != oldWidget.color;
}

class FirstPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var color = ColorDefinition.of(context).color;

    return new Container(
      color: color,
      child: new Column(
        children: <Widget>[
          new RaisedButton(
              child: new Text("next"),
              onPressed: () {
                Navigator.push(
                  context,
                  new MaterialPageRoute(builder: (context) => new SecondPage()),
                );
              }),
        ],
      ),
    );
  }
}

void main() => runApp(
      new MaterialApp(
        builder: (context, child) => new SafeArea(
              child: new ColorDefinition(child: child),
            ),
        home: new FirstPage(),
      ),
    );

หากคุณใช้วิดเจ็ตที่สืบทอดมาคุณไม่ต้องกังวลกับการดูป๊อปของหน้าที่คุณผลักดันซึ่งจะใช้ได้กับกรณีการใช้งานพื้นฐาน แต่อาจพบปัญหาในสถานการณ์ที่ซับซ้อนมากขึ้น

Question 3

มี 2 อย่างคือส่งผ่านข้อมูลจาก

หน้าที่ 1 ถึง 2

ใช้สิ่งนี้ในหน้าแรก

// sending "Foo" from 1st
Navigator.push(context, MaterialPageRoute(builder: (_) => Page2("Foo")));

ใช้สิ่งนี้ในหน้าที่ 2

class Page2 extends StatelessWidget {
  final String string;

  Page2(this.string); // receiving "Foo" in 2nd

  ...
}

หน้าที่ 2 ถึง 1

ใช้สิ่งนี้ในหน้าที่ 2
```
// sending "Bar" from 2nd
Navigator.pop(context, "Bar");
```
ใช้สิ่งนี้ในหน้าแรกเหมือนกันซึ่งใช้ก่อนหน้านี้ แต่มีการปรับเปลี่ยนเล็กน้อย
```
// receiving "Bar" in 1st
String received = await Navigator.push(context, MaterialPageRoute(builder: (_) => Page2("Foo")));
```

Question 4

คุณสามารถใช้ pushReplacement และระบุเส้นทางใหม่

Question 5

เคล็ดลับง่ายๆคือการใช้Navigator.pushReplacementวิธี

หน้า 1

Navigator.pushReplacement(
  context,
  MaterialPageRoute(
    builder: (context) => Page2(),
  ),
);

หน้า 2

Navigator.pushReplacement(
  context,
  MaterialPageRoute(
    builder: (context) => Page1(),
  ),
);

Question 6

งานนี้ดีจริงๆได้จากเอกสารนี้จากเพจflutter : flutter doc

ฉันกำหนดวิธีการควบคุมการนำทางจากหน้าแรก

_navigateAndDisplaySelection(BuildContext context) async {
    final result = await Navigator.push(
      context,
      MaterialPageRoute(builder: (context) => AddDirectionPage()),
    );

    //below you can get your result and update the view with setState
    //changing the value if you want, i just wanted know if i have to  
    //update, and if is true, reload state

    if (result) {
      setState(() {});
    }
  }

ดังนั้นฉันเรียกมันในวิธีการดำเนินการจากหมึก แต่สามารถเรียกได้จากปุ่ม:

onTap: () {
   _navigateAndDisplaySelection(context);
},

และในที่สุดในหน้าที่สองเพื่อส่งคืนบางสิ่ง (ฉันคืนบูลคุณสามารถส่งคืนสิ่งที่คุณต้องการ):

onTap: () {
  Navigator.pop(context, true);
}

Question 7

วางไว้ในตำแหน่งที่คุณกำลังผลักไปยังหน้าจอที่สอง (ภายในฟังก์ชัน async)

Function f;
f= await Navigator.pushNamed(context, 'ScreenName');
f();

ใส่ที่ที่คุณกำลังโผล่

Navigator.pop(context, () {
 setState(() {});
});

setStateเรียกว่าภายในpopปิดเพื่อปรับปรุงข้อมูล

Question 8

วิธีแก้ปัญหาของฉันดำเนินการโดยการเพิ่มพารามิเตอร์ฟังก์ชันบน SecondPage จากนั้นรับฟังก์ชันการโหลดซ้ำซึ่งกำลังดำเนินการจาก FirstPage จากนั้นเรียกใช้ฟังก์ชันก่อนบรรทัด Navigator.pop (บริบท)

หน้าแรก

refresh() {
setState(() {
//all the reload processes
});
}

จากนั้นกดไปที่หน้าถัดไป ...

Navigator.push(context, new MaterialPageRoute(builder: (context) => new SecondPage(refresh)),);

SecondPage

final Function refresh;
SecondPage(this.refresh); //constructor

จากนั้นก่อนถึงบรรทัดการนำทางป๊อป

widget.refresh(); // just refresh() if its statelesswidget
Navigator.pop(context);

ทุกสิ่งที่ต้องโหลดใหม่จากหน้าที่แล้วควรได้รับการอัปเดตหลังจากป๊อปอัป

Question 9

คุณสามารถส่งกลับdynamic resultเมื่อคุณเปิดบริบทแล้วเรียกsetState((){})เมื่อค่าเป็นtrueอย่างอื่นให้ออกจากสถานะตามที่เป็น

ฉันได้วางข้อมูลโค้ดบางส่วนเพื่อเป็นข้อมูลอ้างอิงของคุณ

handleClear() async {
    try {
      var delete = await deleteLoanWarning(
        context,
        'Clear Notifications?',
        'Are you sure you want to clear notifications. This action cannot be undone',
      );
      if (delete.toString() == 'true') {
        //call setState here to rebuild your state.

      }
    } catch (error) {
      print('error clearing notifications' + error.toString());
             }
  }



Future<bool> deleteLoanWarning(BuildContext context, String title, String msg) async {

  return await showDialog<bool>(
        context: context,
        child: new AlertDialog(
          title: new Text(
            title,
            style: new TextStyle(fontWeight: fontWeight, color: CustomColors.continueButton),
            textAlign: TextAlign.center,
          ),
          content: new Text(
            msg,
            textAlign: TextAlign.justify,
          ),
          actions: <Widget>[
            new Container(
              decoration: boxDecoration(),
              child: new MaterialButton(
                child: new Text('NO',),
                onPressed: () {
                  Navigator.of(context).pop(false);
                },
              ),
            ),
            new Container(
              decoration: boxDecoration(),
              child: new MaterialButton(
                child: new Text('YES', ),
                onPressed: () {
                  Navigator.of(context).pop(true);
                },
              ),
            ),
          ],
        ),
      ) ??
      false;
}

ขอแสดงความนับถือ Mahi

Question 10

จำเป็นต้องบังคับให้สร้างวิดเจ็ตไร้สัญชาติของฉันขึ้นมาใหม่ ไม่ต้องการใช้ stateful มาพร้อมกับโซลูชันนี้:

await Navigator.of(context).pushNamed(...);
ModalRoute.of(enclosingWidgetContext);

โปรดสังเกตว่าบริบทและการปิดล้อมWidgetContextอาจเป็นบริบทเดียวกันหรือต่างกัน ตัวอย่างเช่นหากคุณผลักดันจากภายใน StreamBuilder ก็จะแตกต่างออกไป

เราไม่ได้ทำอะไรที่นี่กับ ModalRoute การสมัครสมาชิกเพียงอย่างเดียวก็เพียงพอที่จะบังคับให้สร้างใหม่

Question 11

หากคุณกำลังใช้กล่องโต้ตอบการแจ้งเตือนคุณสามารถใช้อนาคตที่เสร็จสมบูรณ์เมื่อกล่องโต้ตอบถูกปิด หลังจากเสร็จสิ้นในอนาคตคุณสามารถบังคับให้วิดเจ็ตโหลดสถานะใหม่ได้

หน้าแรก

onPressed: () async {
    await showDialog(
       context: context,
       builder: (BuildContext context) {
            return AlertDialog(
                 ....
            );
       }
    );
    setState(() {});
}

ในกล่องโต้ตอบการแจ้งเตือน

Navigator.of(context).pop();

Question 12

วันนี้ฉันเผชิญกับสถานการณ์เดียวกัน แต่ฉันสามารถแก้ไขได้ด้วยวิธีที่ง่ายกว่ามากฉันเพิ่งกำหนดตัวแปรโกลบอลที่ใช้ในคลาส stateful แรกและเมื่อฉันไปที่วิดเจ็ต stateful ตัวที่สองฉันปล่อยให้มันอัปเดตค่าของ global ตัวแปรซึ่งบังคับให้วิดเจ็ตแรกอัปเดตโดยอัตโนมัติ นี่คือตัวอย่าง (ฉันเขียนอย่างเร่งรีบดังนั้นฉันจึงไม่ได้ใส่โครงนั่งร้านหรือแอปวัสดุฉันแค่อยากจะอธิบายประเด็นของฉัน):

import 'package:flutter/material.dart';
int count = 0 ;

class FirstPage extends StatefulWidget {
FirstPage({Key key}) : super(key: key);

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

class _FirstPageState extends State<FirstPage> {
@override
Widget build(BuildContext context) {
return InkWell(
onTap(){
Navigator.of(context).push(MaterialPageRoute(builder: (context) =>
                  new SecondPage());
},
child: Text('First', style : TextStyle(fontSize: count == 0 ? 20.0 : 12.0)),
),

}


class SecondPage extends StatefulWidget {
SecondPage({Key key}) : super(key: key);

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

class _SecondPageState extends State<SecondPage> {
@override
Widget build(BuildContext context) {
return IconButton(
         icon: new Icon(Icons.add),
         color: Colors.amber,
         iconSize: 15.0,
         onPressed: (){
         count++ ;
         },
       ),
     }

Question 13

รหัสง่ายๆนี้ใช้งานได้สำหรับฉันไปที่รูทและโหลดสถานะใหม่:

    ...
    onPressed: () {
         Navigator.of(context).pushNamedAndRemoveUntil('/', ModalRoute.withName('/'));
                },
    ...

บังคับให้ Flutter navigator โหลดสถานะใหม่เมื่อ popping

หน้าที่ 1 ถึง 2

หน้าที่ 2 ถึง 1