Question

我有一个异步组件，已按照Handling-Loading-State指南中的说明进行了注册，并且还有一个数据变量（也可以使用computed或watch）：

// LoadingPageView.vue

const AsyncComponent = () => ({
  component: import ('./MyComponent.vue'),
  loading: LoadingComponent,
  error: ErrorComponent,
  delay: 200,
  timeout: 3000
})

export default {
  data() {
    return {
      isComponentRendered: false,
      ...
    }
  }
}

当isComponentRendered完成渲染后，我希望AsyncComponent为真。

我们如何观看或收听AsyncComponent的呈现状态？

Answer 1

您应该使用mounted：

mounted: function () {
    this.$nextTick(function () {
        // Code that will run only after the entire view has been rendered.
        // i.e Set isComponentRendered = true here.
    })
}

有关确切示例，请参见此处的文档：https://vuejs.org/v2/api/#Options-Lifecycle-Hooks

如何知道异步组件何时完成渲染

1 个答案: