Selector(
selector: (_, store) => store.name,
builder: (_, name, __) {
return Text(name);
},
); ❮
[Flutter] Selector
[Flutter] Selector
Provider는 'It’s all Widgets!' 라는 플러터의 철학에 부합하는
좋은 DI, State 관리 방식이다.
좋은 DI, State 관리 방식이다.
하지만 간단하진 않다.
제대로 쓰기 위해서는 많은 위젯에 대해서 완벽한 숙지를 해야 한다.
제대로 쓰기 위해서는 많은 위젯에 대해서 완벽한 숙지를 해야 한다.
여러 위젯 중에 핵심 위젯을 뽑으라면,
ChangeNotifierProvider가 값을 노출(expose) 하는 위젯의 핵심이고,
Selector는 값을 읽는 위젯의 핵심이라고 할 수 있다.
ChangeNotifierProvider가 값을 노출(expose) 하는 위젯의 핵심이고,
Selector는 값을 읽는 위젯의 핵심이라고 할 수 있다.
문제
텍스트 n개, 버튼 n개가 있고, 하나의 버튼을 누르면 대응되는 텍스트가
변경되는 페이지가 있다고 하자.
변경되는 페이지가 있다고 하자.
텍스트 데이터들은 하나의 ChangeNotifier
객체에 들어있고, 하나의 C-N-P- 에 등록되어있다.
객체에 들어있고, 하나의 C-N-P- 에 등록되어있다.
텍스트 데이터를 Consumer나 Provider.of로 구독하고 있다고 하면,
이 상황에서 버튼 하나를 눌러서 ChangeNotifier 에서 notifyListener()
를 호출했을 때 어떻게 될까?
를 호출했을 때 어떻게 될까?
실제로는 하나의 텍스트만 바뀔 뿐인데도 모든 리스너들이 다시 빌드된다.
이건 매우 비효율적이다.
작은 규모의 앱에서는 Consumer나 Provider.of 만으로도 충분하지만,
규모가 커지고 한 Provider에서 관리하는 데이터가 커질 수록,
위젯 rebuild가 자주 일어날 수록, 위험해진다.
규모가 커지고 한 Provider에서 관리하는 데이터가 커질 수록,
위젯 rebuild가 자주 일어날 수록, 위험해진다.
Selector 예시
Selector
- 위 예시에서 AppStore는 ChangeNotifier 클래스다.
- String은 Selector가 구독할 AppStore 내부에 있는 데이터의 타입이다.
- selector 속성은 BuildContext와 (1) 에서 정의한 ChangeNotifier 인스턴스 를 받아서
(2) 번에서 설정한 타입을 리턴하는 콜백이다. - builder 는 Consumer와 동일하지만 2번째 매개변수인 data는 selector 콜백에서 리턴한 값이다.
작동원리는 Consumer와 동일하다. selector 속성을 이용한다는 것만 다르다.
Provider.of 를 이용해서 값을 가져와서 selector에 지정한 콜백으로 보낸다.
Provider.of 를 이용해서 값을 가져와서 selector에 지정한 콜백으로 보낸다.
기본값으로, collection 패키지에 있는 DeepCollectionEquality 를 이용해서 selector 콜백 리턴값이 이전과 다르면 builder를 다시 호출한다.
shouldRebuild 콜백을 이용해서 builder를 언제 호출할 지 바꿀 수 있다.
.
piano (press key Q)
Categories
flutter
(
82
)
dart
(
34
)
android
(
32
)
kotlin
(
11
)
plugin
(
8
)
provider
(
8
)
vim
(
7
)
bloc
(
6
)
iOS
(
6
)
state management
(
6
)
플러터
(
6
)
PS
(
5
)
algorithm
(
5
)
architecture
(
5
)
async
(
5
)
getx
(
5
)
java
(
5
)
API
(
4
)
BOJ
(
4
)
class
(
4
)
daily
(
4
)
git
(
4
)
golang
(
4
)
memo
(
4
)
riverpod
(
4
)
state
(
4
)
stream
(
4
)
test
(
4
)
web
(
4
)
widget
(
4
)
windows
(
4
)
HTTP
(
3
)
androidX
(
3
)
app state
(
3
)
context
(
3
)
crash
(
3
)
db
(
3
)
editor
(
3
)
error
(
3
)
extension
(
3
)
github
(
3
)
hive
(
3
)
ide
(
3
)
package
(
3
)
pubspec
(
3
)
python
(
3
)
syntax
(
3
)
vscode
(
3
)
app icon
(
2
)
await
(
2
)
chocolatey
(
2
)
consumer
(
2
)
cp949
(
2
)
deployment
(
2
)
dev
(
2
)
flavor
(
2
)
gesture
(
2
)
globalkey
(
2
)
go
(
2
)
google
(
2
)
hack
(
2
)
js
(
2
)
json
(
2
)
key
(
2
)
keystore
(
2
)
list
(
2
)
listview
(
2
)
lock
(
2
)
mac
(
2
)
map
(
2
)
navigation
(
2
)
nosql
(
2
)
project
(
2
)
pub
(
2
)
recyclerview
(
2
)
rxdart
(
2
)
sdk
(
2
)
selector
(
2
)
setting
(
2
)
size
(
2
)
soc
(
2
)
synchronized
(
2
)
tdd
(
2
)
tip
(
2
)
version
(
2
)
viewmodel
(
2
)
vundle
(
2
)
webview
(
2
)
xcode
(
2
)
yaml
(
2
)
책
(
2
)
플러터 단점
(
2
)
16.0
(
1
)
2.0
(
1
)
2023
(
1
)
AATP2
(
1
)
ChangeNotifierProvider
(
1
)
Example
(
1
)
Guava
(
1
)
ImageReader
(
1
)
Mo's algorithm
(
1
)
OAuth2
(
1
)
OpenGL
(
1
)
Oreo
(
1
)
ProgressBar
(
1
)
REST API
(
1
)
Trie
(
1
)
activity
(
1
)
adaptive
(
1
)
android P
(
1
)
android context
(
1
)
android11
(
1
)
apktool2
(
1
)
app exit
(
1
)
append
(
1
)
appicon
(
1
)
arkit
(
1
)
array
(
1
)
asciidoc
(
1
)
async *
(
1
)
async*
(
1
)
audio
(
1
)
authorization
(
1
)
await for
(
1
)
behaviorsubject
(
1
)
beta
(
1
)
binary
(
1
)
binarysearch
(
1
)
blender
(
1
)
book
(
1
)
bottomsheet
(
1
)
break
(
1
)
broadcast
(
1
)
browser
(
1
)
bubbles
(
1
)
bug
(
1
)
build
(
1
)
buildcontext
(
1
)
buildnumber
(
1
)
bundle
(
1
)
button
(
1
)
bytecode
(
1
)
cache
(
1
)
camera2
(
1
)
cameramanager
(
1
)
cd
(
1
)
chrome
(
1
)
ci
(
1
)
circle
(
1
)
clean
(
1
)
clean architecture
(
1
)
cli
(
1
)
clip
(
1
)
clipboard
(
1
)
cloud ide
(
1
)
cmdlet
(
1
)
code
(
1
)
coding test
(
1
)
command
(
1
)
comparator
(
1
)
complexity
(
1
)
concurrency
(
1
)
conditional
(
1
)
const
(
1
)
constraint
(
1
)
constraintlayout
(
1
)
controlc
(
1
)
controlv
(
1
)
converter
(
1
)
copy
(
1
)
copy project
(
1
)
coupling
(
1
)
coverage
(
1
)
cp
(
1
)
css
(
1
)
cupertino
(
1
)
cursor
(
1
)
cv
(
1
)
data class
(
1
)
data structure
(
1
)
dataBinding
(
1
)
database
(
1
)
debounce
(
1
)
decompile
(
1
)
delegate
(
1
)
deno
(
1
)
design pattern
(
1
)
development
(
1
)
device
(
1
)
di
(
1
)
dialog
(
1
)
dio
(
1
)
drawable
(
1
)
drug
(
1
)
emmet
(
1
)
encoding
(
1
)
english
(
1
)
entries
(
1
)
environment
(
1
)
equality
(
1
)
equatable
(
1
)
euc-kr
(
1
)
euckr
(
1
)
exit
(
1
)
expand
(
1
)
expanded
(
1
)
export
(
1
)
extension method
(
1
)
facade
(
1
)
fake
(
1
)
field
(
1
)
figma
(
1
)
final
(
1
)
fixed
(
1
)
flutter pub
(
1
)
flutter web
(
1
)
flutter_inappwebview
(
1
)
flutter_test
(
1
)
flutterflow
(
1
)
fold
(
1
)
fonts
(
1
)
form
(
1
)
frame
(
1
)
future
(
1
)
gestureDetector
(
1
)
gestureRecognizer
(
1
)
gesturearena
(
1
)
get-command
(
1
)
get_cli
(
1
)
getbuilder
(
1
)
getx단점
(
1
)
gitignore
(
1
)
glut
(
1
)
google fonts
(
1
)
gopath
(
1
)
goto
(
1
)
gradient
(
1
)
graphics
(
1
)
gvim
(
1
)
hackaton
(
1
)
hash
(
1
)
hashmap
(
1
)
hot reload
(
1
)
how to
(
1
)
html
(
1
)
i18n
(
1
)
icon
(
1
)
id
(
1
)
impeller
(
1
)
implementation
(
1
)
import
(
1
)
indicator
(
1
)
inkwell
(
1
)
interrupt
(
1
)
intl
(
1
)
introduction
(
1
)
io
(
1
)
isar
(
1
)
iterable
(
1
)
iteration
(
1
)
javascript
(
1
)
julia
(
1
)
juno
(
1
)
jupyter
(
1
)
kakaomap
(
1
)
keytool
(
1
)
korean
(
1
)
kotlin syntax
(
1
)
l10n
(
1
)
lambda
(
1
)
language
(
1
)
layer
(
1
)
layout
(
1
)
lineageOS
(
1
)
localkey
(
1
)
localtoglobal
(
1
)
long list
(
1
)
ls
(
1
)
mac osx
(
1
)
markdown
(
1
)
markup
(
1
)
material
(
1
)
method
(
1
)
microtask
(
1
)
migrate
(
1
)
mintlify
(
1
)
mock
(
1
)
module
(
1
)
monitor
(
1
)
moor
(
1
)
mouse
(
1
)
mouseregion
(
1
)
multiplatform
(
1
)
multiset
(
1
)
multithread
(
1
)
mutable
(
1
)
mvvm
(
1
)
new
(
1
)
node
(
1
)
nodejs
(
1
)
nosuchmethod
(
1
)
null-safety
(
1
)
numberformat
(
1
)
nvim
(
1
)
object
(
1
)
objectbox
(
1
)
objectkey
(
1
)
obx
(
1
)
online ide
(
1
)
operator
(
1
)
orientation
(
1
)
parabeac
(
1
)
parse
(
1
)
paste
(
1
)
path
(
1
)
pattern
(
1
)
pitfall
(
1
)
play store
(
1
)
pod
(
1
)
podfile
(
1
)
pointer
(
1
)
pointers
(
1
)
powershell
(
1
)
private
(
1
)
programming
(
1
)
pull to refresh
(
1
)
puzzle
(
1
)
pycharm
(
1
)
realitykit
(
1
)
recursion
(
1
)
reduce
(
1
)
reference
(
1
)
regex
(
1
)
regular expression
(
1
)
release note
(
1
)
renderbox
(
1
)
renderobject
(
1
)
repl
(
1
)
repository
(
1
)
response
(
1
)
rm
(
1
)
rotue
(
1
)
round
(
1
)
run
(
1
)
scope
(
1
)
scroll
(
1
)
search
(
1
)
server
(
1
)
serverless
(
1
)
service
(
1
)
sharp
(
1
)
singlerepo
(
1
)
singleton
(
1
)
sketch
(
1
)
sliver
(
1
)
sliverlist
(
1
)
snippets
(
1
)
sogae
(
1
)
sorting
(
1
)
source
(
1
)
sparse
(
1
)
sparse array
(
1
)
spec
(
1
)
split
(
1
)
sqflite
(
1
)
sqlite
(
1
)
sqrt decomposition
(
1
)
stateful
(
1
)
statefulwidget
(
1
)
step
(
1
)
stepper
(
1
)
string
(
1
)
stringbuffer
(
1
)
stringbuilder
(
1
)
studio
(
1
)
study
(
1
)
sub-directory
(
1
)
svn
(
1
)
swiftui
(
1
)
swipe to refresh
(
1
)
system_alert_window
(
1
)
system_cache
(
1
)
systemnavigator
(
1
)
tail recursion
(
1
)
tailrec
(
1
)
tap test
(
1
)
text
(
1
)
texteditingcontroller
(
1
)
textfield
(
1
)
texttheme
(
1
)
themedata
(
1
)
then
(
1
)
thread
(
1
)
throttle
(
1
)
time
(
1
)
tool
(
1
)
tools
(
1
)
tooltip
(
1
)
ts
(
1
)
tutorial
(
1
)
typescript
(
1
)
ui
(
1
)
unittest
(
1
)
update
(
1
)
usb
(
1
)
utf8
(
1
)
ux
(
1
)
valuekey
(
1
)
variable
(
1
)
vector
(
1
)
versioncode
(
1
)
very_good
(
1
)
view
(
1
)
vim plugin
(
1
)
vimrc
(
1
)
virtualenv
(
1
)
wasm
(
1
)
web app
(
1
)
webview_flutter
(
1
)
while
(
1
)
widget tree
(
1
)
window
(
1
)
wsl
(
1
)
yield
(
1
)
강의
(
1
)
개발
(
1
)
개발 공부
(
1
)
공부법
(
1
)
그래픽스
(
1
)
꼬리재귀
(
1
)
꿀팁
(
1
)
데노
(
1
)
두줄
(
1
)
디노
(
1
)
번역
(
1
)
블록
(
1
)
상태관리
(
1
)
실험
(
1
)
안드로이드
(
1
)
안드로이드프로젝트
(
1
)
안드로이드프로젝트복사
(
1
)
어이없는
(
1
)
조건부 임포트
(
1
)
주절주절분노조절실패의식으흐름
(
1
)
패키지
(
1
)
프로젝트복사
(
1
)
플러그인
(
1
)