全局属性的“功能”类型上不存在 Vue3 属性“x”

Question

我有一个 Quasar 应用程序，似乎遇到了一个奇怪的问题。 我正在尝试定义一个全局变量，它是一个 object，它只包含有关应用程序的元信息。 该应用程序完全编译，正确的信息显示在 HTML 中，但在 VSCode 中出现错误。

src/boot/BackChat.js

import { boot } from 'quasar/wrappers';

const version = '0.0.0';

const backChat = {
  version
};


export default boot(({ app, router, store }) => {
  app.config.globalProperties.backChat = backChat;
});

登录.vue

// ...
<script>
import { ref } from 'vue';

export default {
  data() {
    return {
      backChat: this.backChat
    };
  }
}
</script>

我使用这个接口是错误的还是这只是 Vue 文件验证的一个错误？ 似乎它认为 Login.vue 中的“backChat”是 function。 如果我将 data() 更改为 mount()，它不再是 function，但是我无法在 DOM 中访问它。 我对 Vue 很陌生。

Answer 1

我有一个解决方法，这是最简单的方法。 我不确定这是否是你应该做的，但是，因为它认为它是一个 function，我只是将 globalProperty 设为 function，它返回 ZA8CFDE6331BD59EB26666F8911ZC4。

src/boot/BackChat.js

// ...
export default boot(({ app, router, store }) => {
  app.config.globalProperties.$backChat = () => backChat;
});

登录.vue

// ...
data() {
    return {
      username,
      password,
      backChat: this.$backChat()
    };
},

这修复了 Vue 文件中突出显示的错误，并允许全局 object 的相同用法。