플러터에서 상태관리를
setState만으로는 불편함이 크다.
그래서 사용하는 것이
Bloc이나 Provider 등이 있다.
(요즘 GetX? 이거 많이 쓰는듯?)
나는 플러터 초보이므로
Provider를 사용해 봤다.
일단 로그인을 위해 나는 사용했다.
아이디와 비밀번호가 입력되면 공유되도록 했다.
(이렇게 써도 되는건지..)
사용방법은 의외로 간단하다.
ChangeNotifier를 상속받은
Provider를 만든다.
class MemberloginProvider extends ChangeNotifier{ /ChangeNotifier를 상속 받아야 한다.
String _mb_id = "";
String _mb_pswd = "";
String get mb_id => _mb_id;
String get mb_pswd => _mb_pswd;
void idUpdate(String mb_id){ //--- 아이디 업데이트
this._mb_id = mb_id;
notifyListeners(); //notifyListeners()를 이용해 변경을 알린다.
}
void passwordUpdate(String mb_pswd){ //--- 비밀번호 업데이트
this._mb_pswd = mb_pswd;
notifyListeners();
}
}
TextFormField위젯에서
onChanged 이벤트에서
변경 된 값을 전달한다.
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:myapp/provider/memberlogin_provider.dart';
class IdTextFormField extends StatelessWidget{
@override
Widget build(BuildContext context){
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
TextFormField(
onChanged: (value) => {
Provider.of<MemberloginProvider>(context, listen: false).idUpdate(value)// 변경된 값을 전달
},
)
],
);
}
}
이제 업데이트 된 값을 아래와 같이 사용할 수 있다.
import 'package:myapp/provider/memberlogin_provider.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
class LoginForm extends StatelessWidget{
String id = "";
@override
Widget build(BuildContext context){
return Form(
child: Column(
children: [
TextButton(onPressed: () {
id= Provider.of<MemberloginProvider>(context, listen: false).mb_id; //--- 업데이트 된 id값을 가져온다.
}, child: Text("로그인"))
],
),
);
}
}
생각보다 간단하게 변경된 값을 가져와 사용할 수 있었다.
웹개발만 하다 보니
플러터에서는
페이지간의 Parameter 전달이라 든가
페이지 내에서 비동기식으로 변경되는 방식이 웹과 달라서 낯설다.
웹이 더 편한거 같은데...?
