Quasar v2 Vue-Apollo Setup

Question

我最近切换到Quasar v2，在获取vue apollo设置所需的信息时遇到了问题。我正在使用https://apollo.vuejs.org/guide/installation.html#_1-apollo客户端尝试使用引导文件将vue apollo安装到框架中。

这是我的启动/aplo.ts文件

import { boot } from 'quasar/wrappers';
import ApolloClient from 'apollo-boost';
import VueApollo from 'vue-apollo';
const apollo = new ApolloClient({
uri: 'https://api.graphcms.com/simple/v1/awesomeTalksClone',
});
const apolloProvider = new VueApollo({
defaultClient: apollo,
});
export default boot(({ app }) => {
// for use inside Vue files (Options API) through this.$apollo
app.config.globalProperties.$apollo = apollo;
// ^ ^ ^ this will allow you to use this.$apollo (for Vue Options API form)
//       so you won't necessarily have to import apollo in each vue file
});
export { apollo, VueApollo, apolloProvider };

这就是我尝试使用它的地方：

import { Vue } from 'vue-class-component';
export default class LoginPage extends Vue {
public login() {
console.log(this.$apollo);
}
}

我得到的错误是

类型"LoginPage"上不存在属性"$apollo"。

我可以在globalProperties的注释中看到它提到了vue选项api。不确定是否会发生这种情况，因为我使用了vue类组件。

Answer 1

我最终在导出下面添加了这个

declare module '@vue/runtime-core' {
interface ComponentCustomProperties {
$apollo: FunctionConstructor;
}
}