asyncComputed 的原理浅析及使用

发表于 分类于 ， ， ， 本文字数： 327 阅读时长 ≈ 1 分钟

在 vue 的计算属性中，是不能使用异步的，这个时候就需要用到 vue-async-computed 这个包提供的 asyncComputed 来实现异步计算属性。

本文将浅析其实现原理，然后介绍使用方法。

主要步骤

  1. 利用 asyncComputed 的 key 在 data 中初始化数据
  2. 将 asyncComputed 的计算属性重命名赋值给 computed
  3. watch 重命名后的计算属性
  4. 当重命名的计算属性更改后，watch 生效，将值赋给 data 中对应的字段

在使用 this.asyncComputedField 时，其实是读取的 data 中对应名称的字段的值

参考

vue-async-computed

Vue 异步计算属性实现

asyncComputed源码解析

asyncComputed 异步计算属性