如何在Flutter自定义组件中添加if、else-if及else条件判断

针对你的需求，这里提供几种简洁的实现方式，直接适配你的GunasoContainer组件：

方式1：嵌套三元运算符（直接写在参数中） #

如果条件不多，直接用嵌套三元可以快速实现，代码紧凑：

GunasoContainer(
  gunasoNum: response.response[index].grievance_no,
  status: response.response[index].status,
  fontColor: response.response[index].status == 'Solved'
      ? Colors.green
      : response.response[index].status == 'Declined'
          ? Colors.red
          : Colors.yellow, // 默认黄色对应pending
)

方式2：提取为工具方法（更易维护） #

如果后续可能增加更多状态，把颜色判断逻辑抽成单独方法会更清晰：

// 先定义一个方法
Color getStatusColor(String status) {
  if (status == 'Solved') {
    return Colors.green;
  } else if (status == 'Declined') {
    return Colors.red;
  } else { // 默认匹配pending
    return Colors.yellow;
  }
}

// 使用时调用方法
GunasoContainer(
  gunasoNum: response.response[index].grievance_no,
  status: response.response[index].status,
  fontColor: getStatusColor(response.response[index].status),
)

方式3：Switch Case 实现（逻辑更直观） #

用switch case处理多分支条件，可读性更强：

Color getStatusColor(String status) {
  switch (status) {
    case 'Solved':
      return Colors.green;
    case 'Declined':
      return Colors.red;
    case 'pending':
      return Colors.yellow;
    default: // 处理未预期的状态值，可设默认颜色
      return Colors.grey;
  }
}

// 调用方式和方式2一致
GunasoContainer(
  gunasoNum: response.response[index].grievance_no,
  status: response.response[index].status,
  fontColor: getStatusColor(response.response[index].status),
)

注意事项 #

• 注意字符串的大小写匹配：比如你的API返回的是'pending'（小写开头），要确保判断时字符串完全一致，避免匹配失败。
• 如果有未预期的状态值，建议在default分支设置一个默认颜色（比如灰色），避免出现异常。

内容的提问来源于stack exchange，提问作者Mr.Robot