不符合eslint的一些写法总结

具体可以上ESlint官网进行查看,此处只是我自己的一些需要纠正的写法

1.consistent-return
解释:要求 return 语句要么总是指定返回的值,要么不指定

错误写法

function doSomething(condition) {
    if (condition) {
        return true;
    } else {
        return; 
    }
}

改正后代码:

function doSomething(condition) {
    if (condition) {
        return true;
    } else {
        return false;
    }
}

不要觉得返回空值undefined会隐式转换为false就可以了,但是这不符合eslint规范

2.no-unreachable
解释:禁止在 return、throw、continue 和 break 语句之后出现不可达代码

错误写法

      switch (algo) {
        case 24: // 智选国内
          return;
          break;
        case 25: // 智选债券
          return 12;
          break;
        case 26: // 智选稳健
          return 13;
          break;
        default:
          return '';
          break;
      }
//此处的return没必要写
if (res.data.error) {
              throw new Error(res.data.error);
              return;
            }

改正后代码:

      switch (algo) {
        case 24: // 智选国内
          return;
        case 25: // 智选债券
          return 12;
        case 26: // 智选稳健
          return 13;
        default:
          return '';
      }
if (res.data.error) {
              throw new Error(res.data.error);
            }

3.no-unused-vars
解释:禁止出现未使用过的变量

错误写法

var y = 10;
y = 5;

改正后代码:

var y = 10;
alert(y);

如果是被其他模块代码引用的变量,可以通过使用注释表明变量已导出

/* exported global_var */

var global_var = 42;

4.vue%2Freturn-in-computed-property
解释: 计算属性中必须要有一个返回值

错误写法

getBankIcon() {
      if (this.investorPaymentMethod) {
        const data = this.investorPaymentMethod.investorBankDetails.data[0];
        console.log(bankIconMap);

        return bankIconMap[data.bankCode];
      }
    },

改正后代码:

getBankIcon() {
      if (this.investorPaymentMethod) {
        const data = this.investorPaymentMethod.investorBankDetails.data[0];
        console.log(bankIconMap);

        return bankIconMap[data.bankCode];
      }
      return ''; // 必须要返回一个值
    },

5.vue%2Fno-side-effects-in-computed-properties
解释:unexpected side effect in computed properties不能再computed中改变页面变量的值

错误写法

<template>
    <select v-model="selected">
    <option v-for="key in getkeys" v-bind:key="key"> {{ key }}</option
    </select>
</template>

data(){
    return{
    selected: '',
    allKeys: [],
    originalKeys: [],  //e.g. ["ALPHA_MIKE]
    getTranslation: {} //e.g. {"ALPHA_MIKE": "ALPHA MIKE"}
    }
},
computed: {
    getkeys(){
        let tableHeaders = [];
        for( var i=0; i<this.originalKeys.length; i++){
            let translation = this.getTranslation[this.originalKeys[i]];
            tableHeaders.push(translation);
        }
        this.selected = tableHeaders[0]; //unexpected side effect here
        this.allKeys = tableHeaders; //unexpected side effect here.
        return this.allKeys;
    }
}

改正后代码:

computed: {
    getkeys(){
        let tableHeaders = [];
        for( var i=0; i<this.originalKeys.length; i++){
            let translation = this.getTranslation[this.originalKeys[i]];
            tableHeaders.push(translation);
        }
        return tableHeaders;
    }
},
watch: {
  getkeys: {
    deep: true,
    handler: function (newVal) {
      this.selected = newVal[0]
      this.allKeys = newVal
    }
  }
}

5.no-inner-declarations

解释:禁止在嵌套的语句块中出现变量或 function 声明

错误写法:

//将函数写在了if语句中
if (data.data) {
          function sortBy(a, b) {
            return b.updateTime - a.updateTime;
          }

          return data.data.content.sort(sortBy) || null;
        }

改正后代码:

function sortBy(a, b) {
          return b.updateTime - a.updateTime;
        }
        if (data.data) {

          return data.data.content.sort(sortBy) || null;
        }

你可能感兴趣的:(bug总结)