Подъём состояния с value и onValueChange
Передавайте состояние вниз, а события — вверх.
«Подъём состояния с value и onValueChange» — бесплатный урок Jetpack Compose Academy на CoddyKit. Это урок 2 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Jetpack Compose Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Jetpack Compose Academy содержит 4 уроков всего.
Части этого урока еще не переведены и отображаются на английском.
State Hoisting in One Line
State hoisting means moving state out of a Composable up to its caller. The component becomes stateless and the parent stays in charge.
The Core Pattern
Replace internal state with two parameters: a value to display and an onValueChange callback to report changes.
fun NameField(value: String, onValueChange: (String) -> Unit) {
TextField(value = value, onValueChange = onValueChange)
}State Down, Events Up
Data flows down through value; user actions flow up through onValueChange. This one-way loop is called unidirectional data flow. ↕️
Who Owns the State Now
The parent owns the state with remember and passes it in. The child never stores it, so two callers can drive the same component differently.
var name by remember { mutableStateOf("") }
NameField(value = name, onValueChange = { name = it })value: The Read Side
The value parameter is what the component shows right now. It is read-only to the child; the child never edits it directly.
onValueChange: The Write Side
When the user types, the child calls onValueChange(newText). The parent decides whether and how to update its state.
Why Not Edit In Place
A stateless child cannot just reassign value, it is only an input. Reporting the change upward keeps a single owner in control.
Controlled Components
This is a controlled component: the parent fully decides what shows. You can transform, ignore, or validate input before storing it.
NameField(value = name, onValueChange = { name = it.uppercase() })Reusing the Same Field
Because the field is hoisted, you can drop it into a login screen, a search bar, or a settings page, each with its own owning state.
Hoisting Beyond Text
The pattern fits any state: a checked Boolean with onCheckedChange, a selected item with onSelect. Same idea, different names.
fun ToggleRow(checked: Boolean, onCheckedChange: (Boolean) -> Unit) {
Switch(checked = checked, onCheckedChange = onCheckedChange)
}A Simple Rule
Hoist state to the lowest common parent that needs to read or change it, no higher. That keeps ownership clear and code clean.
Quick Check
In the hoisting pattern, what does the child do when the user types?
Recap
Hoisting swaps internal state for value plus onValueChange. State flows down, events flow up, and the parent stays in charge. 🚀
Часто задаваемые вопросы
Урок «Подъём состояния с value и onValueChange» бесплатный?
Да — полный текст урока «Подъём состояния с value и onValueChange» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Jetpack Compose Academy, подпишись на CoddyKit PRO. Курс Jetpack Compose Academy содержит 4 уроков всего.
Чему я научусь в уроке «Подъём состояния с value и onValueChange»?
Передавайте состояние вниз, а события — вверх. Ты практикуешь Jetpack Compose Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать Jetpack Compose Academy?
Предыдущий опыт не требуется. Jetpack Compose Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 2 из 4.
Сколько времени занимает урок «Подъём состояния с value и onValueChange»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке Jetpack Compose Academy?
Да. Каждый урок Jetpack Compose Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- Состояние и отсутствие состояния у Composable
- Подъём состояния с value и onValueChange
- Единый источник истины
- Слоты состояния Compose и лямбды содержимого