Flutter - 화면 간 데이터 전달

화면 간 데이터 전달

현재 화면을 FirstPage, 다음 화면을 SecondPage로 지정할 때

다음 화면에 데이터 전달(FirstPage -> SecondPage)

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

받은 데이터 사용(SecondPage)

StatefulWidget

class SecondPage extends StatefulWidget {
  final int data;

  const SecondPage(this.data);

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

class SecondPageState extends State<SecondPage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("SecondPage"),
      ),
      body: Center(
        child: Text("data: ${widget.data}"),
      ),
    );
  }
}

widget.data로 접근할 수 있다.

StatelessWidget

class SecondPage extends StatelessWidget {
  final int data;

  const SecondPage(this.data);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("SecondPage"),
      ),
      body: Center(
        child: Text("data: $data"),
      ),
    );
  }
}

이전 화면에 데이터 전달(SecondPage -> FirstPage)

Navigator.pop(context, returnData);

현재 화면을 닫을 때 넘겨주면 된다.

데이터 받기(SecondPage -> FirstPage)

  floatingActionButton: FloatingActionButton(
        onPressed: () async {
          final returnData = await Navigator.push(
              context,
              MaterialPageRoute(
                  builder: (context) => SecondPage(data)
              )
          );
          if( returnData != null ){
            print("modified: $returnData");
          }
        },
        child: Icon(Icons.edit_rounded),
      ),

await로 SecondPage에서 FirstPage로 보내는 데이터를 기다려야 하기 때문에 함수는 async다.

---

굿