Jetpack Compose中如何将TextField输入内容转换为整数实现数值求和

• 你声明的num1、num2都是String类型，Kotlin中字符串类型的+运算符默认执行拼接逻辑，不会做数值计算。
• 原代码的求和逻辑是在页面重组时直接执行的，没有做类型校验和转换，自然只能得到拼接结果。

在触发按钮点击事件时，先将两个输入的字符串转为数值类型再做求和，同时增加非法输入的兼容处理，修改后的完整代码如下：

fun Add(context: Context) {
    var num1 by remember { mutableStateOf("") }
    var num2 by remember { mutableStateOf("") }
    Column(
        modifier = Modifier.fillMaxSize(),
        horizontalAlignment = Alignment.CenterHorizontally,
        verticalArrangement = Arrangement.Top
    ) {
        TextField(
            value = num1,
            // 限制只允许输入数字，避免非法输入
            keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Number),
            onValueChange = { num1 = it })
        TextField(
            value = num2,
            keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Number),
            onValueChange = { num2 = it })
    }

    Column(
        modifier = Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.Bottom,
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        Button(onClick = {
            // 尝试转成Int，转换失败返回null做兼容
            val n1 = num1.toIntOrNull()
            val n2 = num2.toIntOrNull()
            if (n1 != null && n2 != null) {
                val sum = n1 + n2
                Toast.makeText(
                    context,
                    "result:$sum",
                    Toast.LENGTH_SHORT
                ).show()
            } else {
                Toast.makeText(
                    context,
                    "请输入有效数字",
                    Toast.LENGTH_SHORT
                ).show()
            }
        }) { Text("output") }
    }
}

• 删掉了原代码中无用的冗余代码remember { mutableStateOf("") }
• 修复了原代码中fillMaxsize拼写错误（正确写法为fillMaxSize）、Toast.maketext拼写错误（正确写法为Toast.makeText）
• 把求和逻辑移到了按钮点击回调中，不需要每次页面重组都计算sum，提升性能

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