Jetpack Compose报错：@Composable函数需在可组合上下文中调用

问题原因 #

你使用的Material3 TextField组件没有名为icon的参数，传入的Icon Composable被错误绑定到了非Composable类型的参数上，导致Composable函数在非法上下文调用，连带label内的Text和TextField本身都触发了报错。

解决方案 #

1. 修正参数名：将icon改为Material3 TextField支持的leadingIcon（左侧图标）或trailingIcon（右侧图标）。
2. 确认导入包：确保导入的是Material3相关类：
   • androidx.compose.material3.TextField
   • androidx.compose.material3.TextFieldDefaults

修正后的代码 #

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun EditNumberField(
    value: String,
    @StringRes label: Int,
    @DrawableRes icon: Int,
    keyboardOptions: KeyboardOptions,
    onValueChange: (String) -> Unit,
    modifier: Modifier = Modifier
){
    TextField(
        value = value,
        label = { Text(stringResource(label)) },
        // 根据需求选择leadingIcon或trailingIcon
        leadingIcon = { Icon(painter = painterResource(id = icon), contentDescription = null) },
        keyboardOptions = keyboardOptions,
        onValueChange = onValueChange,
        singleLine = true,
        modifier = modifier,
        colors = TextFieldDefaults.textFieldColors(
            containerColor = Color(0xFFBDFCC9)
        )
    )
}

内容的提问来源于stack exchange，提问作者user25472147