js非空判斷

當我們調接口，返回的數據有null時，直接回顯頁面是不顯示的

 

 可以看到最后一條是沒有數據的，這種情況下前端就要做非空處理

首先在 js 文件里面

export default {
  //判斷字符是否為空的方法
  isEmpty(obj) {
    var regu = "^[ ]+$";
    var re = new RegExp(regu);
    if (typeof obj == "undefined" || obj == null || obj == "" || re.test(obj)) {
      return true;
    } else {
      return false;
    }
  }
}

來到我們的vue組件，引入

import fun from "@/utils/fun";

data() {
    return {
      lineChartData: [],
    }
},
created() {
    this.getPollutionStatus();
  },
  methods: {
    //產廢狀態匯總
    getPollutionStatus() {
        封裝后的接口函數名().then(res => {
        console.log(res.data);
        if (!fun.isEmpty(res.data)) {
          this.lineChartData = res.data;
        }
    }
}

這樣頁面就能回顯了