如何使用vue.js对提取的数据使用函数

埃姆雷·奥泽（Emre Ozer）

我正在与获取数据;

data() {
  return {
    staffs: "",
    salaries:0,
    loading:true,
  };
},

methods: {
  async getStaffs() {
    const result = await axios.get(
      "/api/staffs/"
    );
    this.staffs = result.data
    this.loading = false
  },

  totalSalary(){

  for(var i = 0 ;i++;i<this.staffs.length){
    this.salaries += this.staffs[i].job.salary
  }
},

mounted() {
  this.getStaffs()
  this.totalSalary()
},

}

我想在获取数据后计算总薪水，并将其呈现为

<span >Total Salary: {{salaries}}</span>

正确的方法是什么？我不想这样使用超时或smt。

黄道

您只需async/await在mounted钩子中使用

data() {
    return {
      staffs: "",
      salaries:0,
      loading:true,
    };
  },

methods: {
    async getStaffs() {
      const result = await axios.get(
        "/api/staffs/"
      );
      this.staffs = result.data
      this.loading = false
    },
    totalSalary(){
      for(var i = 0 ;i++;i<this.staffs.length){
        this.salaries += this.staffs[i].job.salary
      }
  },


  async mounted() {
       await this.getStaffs() // wait for getStafss to finish executing
       this.totalSalary()
  },

但是，根据您的情况，我建议您使用computed道具来计算totalSalary

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。