我正在使用typecript和vue。
在我的应用程序中有一个服务
,它对每个子组件都是全局的。
我在vue JS上找到了本机vue解决方案,将此属性注入子组件。
在main.ts
const service = new MyService(...);
new Vue({
router,
provide() { return { service }; } // provide the service to be injected
render: h => h(App),
}).$mount("#app");
在任何typescript vue组件上
import Vue from "vue";
export default Vue.extend({
inject: ["service"], // inject the service
mounted() {
console.log(this.service); // this.service does exists
},
});
这样我就可以在我的子组件上获得注入的服务。
然而我得到了Hibernate错误
属性“service”不存在于类型“组合VueInstance”上
如何解决这个打字稿编译错误?
为注入创建一个接口,并在需要的地方扩展特定组件的Vue:
主要的ts:
const service = new MyService(...);
export interface ServiceInjection {
service: MyService;
}
new Vue({
router,
provide(): ServiceInjection { return { service }; } // provide the service to be injected
render: h => h(App),
}).$mount("#app");
使用您的接口的组件
import Vue from "vue";
import { ServiceInjection } from 'main.ts';
export default ( Vue as VueConstructor<Vue & ServiceInjection> ).extend({
inject: ["service"], // inject the service
mounted() {
console.log(this.service); // this.service does exists
},
});
您不需要使用类组件来实现这一点。对于对象组件声明,有两种方法:
export default {
inject: ['myInjection'],
data(): { myInjection?: MyInjection } {
return {}
},
}
缺点是您必须将其标记为可选才能将其添加为数据返回。
declare module 'vue/types/vue' {
interface Vue {
myInjection: MyInjection
}
}
export default {
inject: ['myInjection'],
}
如果您想在所有Vue组件中使用某些服务,您可以尝试使用插件。
在main.ts您只需导入它:
import Vue from "vue";
import "@/plugins/myService";
在plugins/myService.ts
中,您必须编写如下内容:
import _Vue from "vue";
import MyService from "@/services/MyService";
export default function MyServicePlugin(Vue: typeof _Vue, options?: any): void {
Vue.prototype.$myService = new MyService(...); // you can import 'service' from other place
}
_Vue.use(MyServicePlugin);
在任何vue组件中,您都可以使用它:
<template>
<div> {{ $myService.name }}</div>
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
@Component
export default class MyComponent extends Vue {
private created() {
const some = this.$myService.getStuff();
}
}
</script>
不要忘记在d.ts
文件中声明$myService
。在项目的某个地方添加文件myService。d、 ts
包含以下内容:
import MyService from "@/services/MyService";
declare module "vue/types/vue" {
interface Vue {
$myService: MyService;
}
}
奇怪的是,即使是这种变体 我还是得到同样的错误。
当我尝试将我的maven项目部署到Glassfish 5时,我得到以下错误: [[FATAL]在索引0处找不到类型为public javax.ws.rs.core.response com.test.resources.AccountResource.AddProfilePicture(java.io.inputStream,org.glassfish.jersey.media.multipart
本文向大家介绍vue组件watch属性实例讲解,包括了vue组件watch属性实例讲解的使用技巧和注意事项,需要的朋友参考一下 本文实例为大家分享了vue组件watch属性的具体代码,供大家参考,具体内容如下 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持呐喊教程。
在我的Spring Boot Application中,我用一个调用存储过程的方法实现了以下类。 由于调用存储过程需要数据库连接,所以我需要从应用程序加载这些相应的属性值。特性: 基于以下关于类似问题的文章,Spring boot—应用程序中的自定义变量。属性,并在您自己的类和Spring Boot@ConfigurationProperties示例中使用Spring Boot配置属性,我为我的类
我只是在用java阅读输入文件,直到我在最基本的步骤上被难住了。。。正在查找输入文件! 输入。txt文件与调用它的类文件位于同一目录中,但eclipse仍给我一个错误,即找不到它: "线程"main"中的异常java.lang.错误:未解决的编译问题:未处理的异常类型FileNotFoundException" 我的代码: 输入txt在同一个包、同一个文件夹和所有内容中。我很困惑:(
我试图运行Webpack上的一个项目和我得到多个错误 我应该安装我所有的打字,所以我不知道这些是从哪里来的。我试图从一个编译的项目中复制package.json,但没有帮助。我错过了什么? 我的tConfig看起来像这样