将方法作为绑定表达式调用到mustache标记内，并返回值

Question

在下面的例子中，假设在头像中呈现总值。

如果我在方法中取消对'return 7‘的注释，那么数字7就会呈现在头像中。

如果我取消对console.log ()的注释，我可以正确地获得合计值。

但是，使用return response.data.total [0].total时，我不能显示该值。

<q-avatar v-if="item"> {{ getItemNumber(item) }}  </q-avatar>


methods: {      
    getItemNumber(item){
       // return 7; //OK
        this.$axios.get(`/getnumber/${item.id_parent}`)
        .then((response) => {
            if (response.data.success) {

                //console.log(response.data.total[0].total); // get number 7      
                return response.data.total[0].total; //??

          } else { }
        })
        .catch(error => {         
        });
    }
}

codpen：https://codepen.io/ijose/pen/dyoVyLj

代码笔模拟挂载()：https://codepen.io/ijose/pen/zYGEGOe

Answer 1

您还需要从getItemNumber函数返回axios调用。

所以return 7;会工作，因为它不在axios中，调用它将直接返回值。而是用于从axios响应中返回值。

下面的代码将在调用getItemNumber时返回响应的值

试试这个。

getTotal(car){
         console.log(car.id_car);        

         // return 7; //OK


        return this.$axios.get(`/totalsales/${car.id_car}`)
        .then((response) => {
            if (response.data.success) {   
                return response.data.total[0].total; //?? HERE

          } else { }
        })
        .catch(error => {         
        });
         // -->
      }

function axiosTest() {
  return axios.get(url).then(response => {
    // returning the data here allows the caller to get it through another .then(...)
    return response.data
  })
}

axiosTest().then(data => {
  response.json({ message: 'Request received!', data })
})

已更新

只需创建映射字典即可。

total_dict:{}

方法

getTotal(car){
         console.log(car.id_car);        
           axios.get(`https://api.github.com/users/barbier`)
        .then((response) => {
            this.$set(this.total_dict,car.id_car,response.data.id)
        .bind(this)})
        .catch(error => {         
        });

      }

codepen - https://codepen.io/Pratik__007/pen/XWbezrJ?editors=1010