# <center>前端 Code Review</center>

本文件仅记录框架、代码风格、方法调用中的问题及建议。样式和功能问题不在此讨论。

## 2022-09-15

### [JG-APM-FRONTEND](http://gogs.jgiot.com:3000/jiangtao/JG-APM-FRONTEND/src/develop/jg-apm-frontend)

开发人员：刘人维

#### 问题及建议

* `框架`
    为什么依赖中既有antV，也有element-ui？图形库也是，既有g6，也有echarts

* `其他` 80端口

    建议不要使用80端口作为调试服务端口。此端口为http服务默认端口，在linux环境中经常被占用，且经常默认可通过防火墙
* `逻辑优化`

    axios生成的Promise，很多地方没有catch。建议使用`element-ui`的`message`组件统一提示
* `框架`
    
    表格组件，有的地方是`avue`，有的地方是`el-table`
* `风格` /src/views/orderStatistics/jobMonitoring/index.vue
    ```javascript
    ...
     data() {
        return {
            search: {},
            data: [],
            data2: [],
    ...
    ```
    不要使用`data`,`data2`这样的命名方式，变量名要简要对数据进行说明
* `逻辑优化`

    使用`await`时没有`try...catch...`

* `风格`

    尽可能使用`const`声明变量，在某些函数体内部用的是`let`

* `风格` /src/views/orderStatistics/outputStatistics/index.vue

    ```html
     <el-table-column prop="completTime" label="完工时间" width="180" align="center"></el-table-column>
     <!--应该为"completeTime"-->
    ```
    启用IDE的拼写检查，尽量避免typo

* `风格`  /src/views/orderStatistics/processAnomaly/cpn/ProcessAnomalyDialog.vue

    ```javascript
    let { totalCount, totalPages, list } = res.result
    //totalPages未使用
    ```
    解构对象时，省略未使用的属性

* `框架`

    使用`v-slot`替换`slot-scope`