codeReview(2)

55 阅读1分钟

1.代码混乱

调整前:

computedField: function(){
    return this.trendValue?.length > 0 ? this.trendValue.join('') : 'cpu
    let lastLength
    let value
    if (this.trendValue? .length != TastLength) {
    lastLength = this.trendValue? .length
    if (this.trendValue === 0)
        value = this.trendValue[日]
     else if (this.trendValue < ) 
        value = 
    return this.trendValue?.length > 0 ? this.trendValue.join(',) : value
}

调整后:( join在数组为空时,返回空字符串)

this.trendValue.join(',)

2 超过三个属性 换行 (为了开发方便一般会让代码界面不换行,不这么做的话代码会诡异的两行)

调整前:

<input v-model="mForm.disk_total_enabled" type="checkbox" style="zoom:180%;"
@click="vmForm.disk_total_enabled = !vmForm.disk_total_enabled" />

调整后:

<div class="input-item">
    <input
        v-model="vmFormdisk used enabled'
        type="checkbox"
        style="zoom:180%;"
        @click="vmForm.disk_used_enabled = !vmForm.disk_used_enabled" />
    <div>自动获取</div>
</div>

3.返回一个数组用map

调整前:

 if (res.data.length > 0) {
    res.data.forEach((item) => {
        this.analyzeInsTypeList.push({
            id: item.id,
            name: item.config_name
        })
    })
    this.analyzeInsTypeValue = this.analyzeInsTypeList[0].id
    // 获取账号后再初始化 再获取使用趋势
    this.getCapacityTrend()
}

调整后:

if (res.data.length > 0) {
    this.analyzeInsTypeList = res.data.map(item => ({ id: item.id, name: item.config_name }));
    // 获取账号后再初始化 再获取使用趋势
    this.analyzeInsTypeValue = this.analyzeInsTypeList[0].id;
    this.getCapacityTrend();
}