Vue Apollo - 收到查询数据后响应的最佳实践

Question

我的应用程序中有一个 table 组件，我希望根据计算自动调整其高度 (window height - (menuHeight + footerHeight)。menuHeight 是本地数据我的 apollo 缓存，需要在我的 table 组件中接收查询。在 2 种情况下，此计算需要运行：

收到apollo数据时
任何时候 window 身高变化

我需要帮助来确定满足两者的最佳方法。计算的属性满足第一个但不更新为 window 高度变化（img 1），并使用方法和事件侦听器（img 2）更新适用于第二种情况但我不知道如何运行一旦接收到或更改了 apollo 数据，因为我不能运行 mounted 或 beforeUpdate 生命周期中的方法。

Answer 1

您可以使用 watch (see the Vue docs here):

watch: {
  ui(newValue, oldValue) {
    resizeTableHeight() // or whatever...
  }
}

Vue Apollo - 收到查询数据后响应的最佳实践

Vue Apollo - best practice for responding to query data once received

vue.js

vue-apollo