DEV/flutter (dart)

Flutter 자식 위젯에서 부모 위젯 변수 접근(수정)하기 (함수사용)

석봉 2023. 2. 2. 12:33

자식 위젯에서 부모 위젯의 변수를 접근 및 수정하려고 한다.

 

여러 방법이 있는데 여기서는 함수를 사용하여 변수를 수정하고자 한다.

 

결과적으로 방법은 다음과 같다.

 

1. 부모 위젯(ParentWidget)에서 State 처리 함수를 생성(Re-Rendering이 필요한 경우), setState() 함수를 통하여 값을 변경해 줄 것.

 

2.  부모 위젯에서 생성한 함수를 자식 위젯(ChildWidget)에 function parameter로 전달.

 

3. 자식 위젯에서 전달받은 function parameter를 등록함.

 

4. 자식 위젯에서 등록한 function을 상황에 맞게 실행.

(함수에 매개변수 추가 가능)

// 부모 위젯(ParentWidget)
...(대충 위젯 구성)
var num = 0;  // 변경할 변수
addNum() {  // 변수를 변경하기 위한 함수, 자식 위젯(ChildWidget)에 전달하여 사용
  setState(() {
    num++;
  });
}

return ChildWidget(notifyParent: addNum);  // 변수를 parameter로 넘겨주기


// 자식 위젯(ChildWidget)
class ChildWidget extends ...Widget {
  // 부모에서 던진 function parameter 등록 ()
  ChildWidget({Key? key, required this.notifyParent}) : super(key: key);
  final notifyParent;
  
  // notifyParent 사용가능!
  ...
  TextButton(onPressed: (){
    notifyParent();
  }
  ...
}