如何从组件属性访问 class 成员？

Question

我需要创建一个 mixin 来设置 header 和元数据。为此，我找到了 vue-meta，效果很好。但我还不熟悉打字稿和基于 class 的组件。

如何在组件属性 metaInfo() 中访问 class 成员 pageTitle？

示例代码：

import Vue from 'vue';
import { Component } from 'vue-property-decorator';

@Component({
  metaInfo() {
    return {
      title: pageTitle, // here I would like to access class member
    };
  },
})
export default class headerMixin extends Vue {
  pageTitle: string = 'Page Title'; // definition of class member
}

Answer 1

考虑到 metaInfo 函数接收组件实例作为上下文，它可以像这样完成：

@Component({
  metaInfo(this: headerMixin) {
    return {
      title: this.pageTitle
    };
  },
})
export default class headerMixin extends Vue {
  pageTitle: string = 'Page Title';
}

如何从组件属性访问 class 成员？

How to access class members from component properties?

typescript

vue.js

vuejs2

vue-component

vue-meta