본문 바로가기
기초다지기/Flutter&Dart

Flutter Provider?

by 김빵그 2023. 5. 21.
 

Simple app state management

A simple form of state management.

docs.flutter.dev

Provider? 

  • 간단한 앱 상태 관리
flutter pub add provider

1. ChangeNotifier

  • 리스너에게 변경 알림을 제공하는 flutter 간단한 클래스 value값이 변경되는지 확인
  • notifyListeners() 코드를 사용하여 호출
  • 앱의 ui를 변경할 수 있는 방식으로 모델이 변경 될 때마다 이 메서드를 호출한다

2. ChangeNotifierProvider

  • 자손에게 인스턴스를 제공하는 위젯으로..어떤 위젯부터 시작을 할지 시작점 결정 
  • 클릭할때마다 +count 되는 버튼 만들때 주로 사용..
void main() {
  runApp(
    MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (context) => CartModel()),
        Provider(create: (context) => SomeOtherClass()),
      ],
      child: const MyApp(),
    ),
  );
}

3. Consumer 

return Consumer<CartModel>(
  builder: (context, cart, child) => Stack(
    children: [
      // Use SomeExpensiveWidget here, without rebuilding every time.
      if (child != null) child,
      Text('Total price: ${cart.totalPrice}'),
    ],
  ),
  // Build the expensive widget here.
  child: const SomeExpensiveWidget(),
);
  • 액세스 하려는 모델의 유형을 지정해야 한다. 연결해주는 스크린/버튼...등등

4. Provider.of

  • 경우에 따라 UI를 변경하기 위해 모델의 데이터가 실제로 필요하지 않지만 여전히 엑세스 해야 하는데, 예를 들어 clearcart버튼은 사용자가 카트에서 모든 것을 제거할 수 있도록 허용해야 한다. 이때 카트 내용물을 표시할 필요가 없고 메서드를 호출하기만 하면 됨 clear()
Provider.of<CartModel>(context, listen: false).removeAll();