如何在三元运算符中实现多if分支逻辑并修复Flutter代码错误

你写的嵌套三元运算符语法层面没有问题，三元本身支持嵌套实现多分支逻辑，错误全部出在判断条件和业务逻辑不匹配，另外还有可优化的冗余写法：

• 第二个分支的判断条件重复校验了yellows，缺失了browns的判断，和你要实现的黄、黑、棕三色同时为真的逻辑不符
• 第三个分支的判断条件写的是reds、yellows、blacks同时为真，但对应分支输出文本用到的是$reds和$whites变量，和业务逻辑完全不匹配，会导致符合条件时无法触发对应分支
• 写法冗余：布尔变量直接用作判断条件即可，不需要额外加== true

修正后的代码（保留嵌套三元写法） #

Text(
  (browns && blacks && whites)
    ? 'Proportion: $browns agutis : $blacks pretos : $whites albinos'
    : (yellows && blacks && browns)
      ? 'Proportion: $yellows dourados : $blacks pretos : $browns chocolates'
      : (reds && whites)
        ? 'Proportion: $reds coloridos : $whites brancos'
        : 'Invalid proportion',
),

更推荐的写法（提升可读性） #

多层三元嵌套可读性较差，更推荐把逻辑抽成独立方法：

// 提前定义逻辑方法
String getProportionText() {
  if (browns && blacks && whites) {
    return 'Proportion: $browns agutis : $blacks pretos : $whites albinos';
  } else if (yellows && blacks && browns) {
    return 'Proportion: $yellows dourados : $blacks pretos : $browns chocolates';
  } else if (reds && whites) {
    return 'Proportion: $reds coloridos : $whites brancos';
  } else {
    return 'Invalid proportion';
  }
}

// 组件内直接调用
body: Center(
  child: Column(
    mainAxisAlignment: MainAxisAlignment.center,
    children: [
      Text(
        getProportionText(),
        style: TextStyle(
          fontFamily: 'courier',
          fontSize: 20.0,
          fontWeight: FontWeight.bold,
          height: 2.5,
          letterSpacing: 0.7
        ),
      ),
    ],
  ),
),

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