Vue中使用computed实现数组中每个对象里面的内容保留小数且为null的让内容为无

首先说一下问题，开发中遇到一个需求是这样的，需要将接口中返回的数据做一个处理，这个数据格式是一个大的数组中包很多对象，每个对象中是一个个字段，那些字段有的是小数，有的是整数，整数的话不用处理，小数就得保留4位；本来是打算一个一个处理的，但是因为数据量太大，就想了想借助computed写了一个方法；

HTML 这是其中一个数组
<tr v-for="(item, index) in companyList" :key="index">
  <td colspan="2">{{ item.companyName }}</td>
  <td>{{ item.fullApertureAvgElectricityRate }}</td>
  <td>{{ item.cityAvgElectricityRate }}</td>
  <td>{{ item.countryAvgElectricityRate }}</td>
  <td>{{ item.fullApertureAvgStopHour }}</td>
  <td>{{ item.cityAvgStopHour }}</td>
  <td>{{ item.countryAvgStopHour }}</td>
  <td>{{ item.fullApertureAvgStopHz }}</td>
  <td>{{ item.cityAvgStopHz }}</td>
  <td>{{ item.countryAvgStopHz }}</td>
</tr>

computed这个生命周期他是当页面中有某些数据依赖于其他数据的变化进行改变的时候，可以使用computed的计算属性，计算属性具有缓存性；
他是在HTML，DOM加载后马上执行的，比如赋值操作；
在需要对很多的数据进行处理和计算并且有另一个值需要依赖这个数据进行变化的时候就需要计算属性
computed里面的方法名就相当于一个data中的变量，但是在方法最后你需要把最后处理完成的那个值return出去，这个是必须要的；

computed: {
    companyList() {
      let obj = this.equipDcList
      // 这里先循环一下整个数组取出他的每一个对象
      obj.forEach((item) => {
      // 然后再通过for in方法循环对象
        for (var key in item) {
          if (item[key]) {
          // 判断一下对象中的每个值是否都存在或者有值，如果有的话那就通过正则把来截取他小数点的后4位
            item[key] = String(item[key]).replace(/^(.*\..{4}).*$/, '$1')
          } else {
          // 否则就把当前的值改为'无'
            item[key] = '无'          }
        }
      })
      // 最后return
      return obj
    },
  },