错误解决 ---- Unexpected lexical declaration in case block no-case-declarations

1. 报错提示

  154:15  error  Unexpected lexical declaration in case block  no-case-declarations
  154:21  error  'resId' is assigned a value but never used    no-unused-vars
  158:15  error  Unexpected lexical declaration in case block  no-case-declarations
  158:21  error  'uid' is assigned a value but never used      no-unused-vars
  162:15  error  Unexpected lexical declaration in case block  no-case-declarations
  162:21  error  'msg' is assigned a value but never used      no-unused-vars

2. 报错截图

3. 报错场景

接入第三方的双因子认证，按照其文档编写代码时候的报错。

4. 分析报错

错误提示是由于 JavaScript 代码中在 switch 语句的 case 块内不期望出现的字典声明（lexical declaration）。在ES6及以上版本中，let和const声明可以在全局作用域或函数作用域中使用，但不能直接用在case块内。

5. 解决办法

将 case 块内的变量声明移动到 switch 语句外面或者将变量声明提前到 switch 语句之前。

5.1 错误代码

const { type, data } = e.data;
switch(type){
    case "userInfo":
      const resid = data;
      console.log(data)
      break;
    case "empty":
      const id = data;
      console.log(data)
      break;
    case "error":
      const msg = data;
      console.log(data)
      break;

5.2 解决办法一：使用 var 代替 let、const

const { type, data } = e.data;
switch(type){
    case "userInfo":
      var resid = data;
      console.log(resid)
      break;
    case "empty":
      var id = data;
      console.log(id)
      break;
    case "error":
      var msg = data;
      console.log(msg)
      break;

5.3 解决办法二：将变量声明提前到 switch 语句之前

const { type, data } = e.data;
let resid = '', id = '', msg = '';
switch(type){
    case "userInfo":
      resid = data;
      console.log(resid)
      break;
    case "empty":
      id = data;
      console.log(id)
      break;
    case "error":
      msg = data;
      console.log(msg)
      break;

5.4 解决办法三：不对返回变量赋值，直接进行操作

const { type, data } = e.data;
switch(type){
    case "userInfo":
      this.$message.warning(data)
      break;
    case "empty":
      this.$message.warning(data)
      break;
    case "error":
      this.$message.warning(data)
      break;

6. 总结

1. 第三方的文档是在他的环境下进行验证的，代码放到我们自己对接的环境，需要我们适配，解决可能存在的报错处理；
2. 报错不可怕，只要一步一步的找到报错的原因，查找报错的原因，解决报错，其实每次报错都是一次积累，至于积累的多少，就看你对每次报错解决的深度，不要羡慕那些一来就能决绝错误的人，他只是比你更加有解决错误的经验而已。认真面对自己的每一个报错，经常总结，你总会有一点点的进步。