将 Jetpack Compose State 委托语法与数据类一起使用

Question

我真的很喜欢将by 委托与Compose State 一起使用，因为它隐藏了具有“反应性”数据的样板，即：

val message: String by remember { mutableStateOf("") }

message = "No boilerplate"

以这种方式使用 props 时，单向数据流（或 props down，event up）是干净且容易的。

但是，当想要在 data class 中将数据组合在一起，或将视图模型道具作为状态观察（即：使用 observeAsAState()）时，我必须声明 State 类型的道具，例如：

data class MyUiProps(
  val message: State<String>
)

/*
 * Different ways of creating instances of `MyUiProps`.
 * 
 * In the examples the result is of type `State` rather than
 * `String` like using the `by` delegate
 *
 */
var props = MyUiProps(viewModel.message.observesAsState(""))
props = MyUiProps(remember { mutableStateOf("") })

props.message.value = "Urgh boilerplate"

有没有办法将by 委托与如下伪代码类似的数据类一起使用

data class MyUiProps(
  val message: String
)

val props = MyUiProps(
  message = by remember { mutableStateOf("") }
)

props.message = "Yay no boilerplate"

Answer 1

只需使用MyUiProps 作为您在 ViewModel 中公开的状态。公开单个字段既乏味又不可读。

如果你在 ViewModel 中有这样的东西：

// Expose whole state in ViewModel
private val _state = MutableStateFlow(MyUiProps()) // this will set default values in the model
val state: StateFlow<MyUiProps> = _state // observe this as state in compose

// inside ViewModel if you want to update the state
_state.value = _state.value.copy(fieldYouWantToUpdate = newValue)

// in composable
val state by viewModel.state.collectAsState()

Answer 2

你不能在构造函数中使用by。尽管如此，您仍然不需要您展示的所谓的“样板”。这就是你的做法：

data class MyUiProps(
    var message: MutableState<String>
) {

}

val props = MyUiProps(
    message = remember { mutableStateOf("") }
)

props.message.value = "Yay no boilerplate"

您需要在数据类参数中使用MutableState 而不仅仅是State。这避免了使用observeAsState