uniapp中switch case的用法详解

在uniapp中如何使用switch case语句？能否提供一个具体的代码示例，说明在不同情况下如何执行不同的操作？比如根据不同的条件跳转页面或显示不同的内容。另外，switch case和if else在uniapp中哪个性能更好？

2 回复

在uniapp中，switch case用于多条件判断。语法如下：

switch(表达式) {
  case 值1:
    // 代码块
    break;
  case 值2:
    // 代码块
    break;
  default:
    // 默认代码块
}

注意：每个case后要加break，否则会继续执行后续case。default为默认情况，可选。


在 UniApp 中，switch case 是一种条件语句，用于根据表达式的值执行不同的代码块。它适用于多条件分支场景，比多个 if else 更简洁高效。

基本语法

switch (expression) {
  case value1:
    // 当 expression 等于 value1 时执行的代码
    break;
  case value2:
    // 当 expression 等于 value2 时执行的代码
    break;
  default:
    // 当没有匹配的 case 时执行的代码
}

关键点

  • expression：被比较的表达式或变量。
  • case：每个分支的值，使用严格比较（===）。
  • break：终止当前 case，防止继续执行后续 case。
  • default：可选，当无匹配时执行。

示例代码

let fruit = 'apple';

switch (fruit) {
  case 'apple':
    console.log('苹果');
    break;
  case 'banana':
    console.log('香蕉');
    break;
  default:
    console.log('未知水果');
}
// 输出：苹果

注意事项

  1. 必须用 break：省略 break 会导致“穿透”，执行后续 case 代码。
  2. 多 case 共用代码：可省略 break 实现多个值执行相同逻辑。
    switch (day) {
  case 1:
  case 2:
  case 3:
    console.log('工作日');
    break;
  case 6:
  case 7:
    console.log('周末');
}
  3. 适用场景：枚举值、固定选项判断（如状态码、类型）。

在 UniApp 中，switch case 常用于处理页面逻辑、事件回调或数据状态判断，例如根据 type 值渲染不同组件。

回到顶部