Using state in Jetpack Compose – 단방향 데이터 흐름 이해하기 | 찰스의 안드로이드

단방향 데이터 흐름

계층형 컴포즈의 단방향

컴포즈의 계층 관계에서 상위 컴포즈의 State는 하위 컴포즈에 인수로 전달할 수 있다.

• 단, 이러한 상위 컴포즈의 State 는 하위 계층에서 직접 변경해서는 안된다.
• 콜백을 하위 컴포즈에 전달해, State를 직접 변경하는 이벤트를 상위 컴포즈로 이벤트를 전달할 수 있다.
• 상위 컴포즈는 Event를 받아 직접 State를 변경한다.

@Composable
fun FunctionA() {
		var swtichState by rememher { mutableStateOf(true) }
		
		// 하위 컴포즈로부터 event를 호출받으면, 상위컴포즈에서 직접 자신의 state 를 변경한다.
		val onSwitchChange = { value : Boolean -> switchState = value }

		FunctionB(
				// State 는 하위 컴포즈로 전달할 수 있다.
				switchState = switchState,
				// State는 하위 컴포즈에서 직접 변경할 수 없으므로, 
				// Event를 하위컴포즈에서 호출해 상위 컴포즈에서 직접 State를 변경한다.
				onSwitchChange = onSwitchChange
		)

@Composable
fun FunctionB(switchState: Boolean, onSwitchChange : (Boolean) -> Unit) {
		//swtichState 가 변경될때마다, FucntionB 도 파라미터로 받으니 같이 재구성된다.	
		Switch(
			checked = switchState,
			onCheckedChange = onSwitchChange
		)
}

위와같은 상위 컴포즈로부터 State를 받고, Event를 상위 컴포즈에 위임하는것을 상태 끌어올리기(State Hoisting) 이라고 한다.

ViewModel 과 View의 단방향 흐름