programing

형식 설명 2.6.1에서 vue js @Component를 사용하는 방법은 무엇입니까?

itsource 2022. 7. 29. 23:24
반응형

형식 설명 2.6.1에서 vue js @Component를 사용하는 방법은 무엇입니까?

작은 컴포넌트를 만들었습니다.

import Vue from 'vue';
import Component from 'vue-class-component';
import { Inject, Model, Prop, Watch } from 'vue-property-decorator';

@Component({
    template: require('./home.html'),
})
export class HomeComponent extends Vue {
    name: string = 'User';
}

typescript@2.5.3을 사용하여 문제없이 프로젝트를 컴파일할 수 있습니다.

그러나 typescript@2.6.1을 사용하려고 하면 다음 오류가 나타납니다.

[at-loader] ./src/components/home/home.ts의 오류: 8:2

TS2345: Argument of type 'typeof HomeComponent' is not assignable to parameter of type 'VueClass<Vue>'.
Type 'typeof HomeComponent' is not assignable to type 'new (...args: any[]) => Vue'.
  Type 'HomeComponent' is not assignable to type 'Vue'.
    Types of property '$options' are incompatible.
      Type 'ComponentOptions<HomeComponent, DefaultData<HomeComponent>,
      DefaultMethods<HomeComponent>, Defaul...' is not assignable to type 'ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Rec...'.
      Type 'HomeComponent' is not assignable to type 'Vue'.

다음 3줄의 코드에 문제가 있는 것으로 알고 있습니다.

@Component({
    template: require('./home.html'),
})

다음과 같이 교체하려고 했습니다.

@Component

에러가 발생했습니다.

ERROR in [at-loader] ./src/components/home/home.ts:7:1
TS1238: Unable to resolve signature of class decorator when called as an expression.
Type '<VC extends VueClass<Vue>>(target: VC) => VC' is not assignable to type 'typeof HomeComponent'.
  Property 'extend' is missing in type '<VC extends VueClass<Vue>>(target: VC) => VC'.

그래서 3행 @Component를 완전히 제거하려고 했습니다.

확실히 코드는 컴파일 되어 있습니다.

[탑승자] OK, 0.97초

하지만 프로그램이 작동하지 않습니다.

[Vue warn]: Failed to mount component: template or render function not defined.

found in

---> <Anonymous>
       <Root>

형식 설명 2.6.1에서 vue js @Component를 사용하는 방법은 무엇입니까?

같은 문제가 발생하여 이 오류를 제거할 수 있는 방법은 tsconfig.json을 추가하는 것입니다.

"strictFunctionTypes": false

이것은 기능을 확인하는 방법의 변화입니다.

언급URL : https://stackoverflow.com/questions/47100589/how-use-vue-js-component-with-typescript-2-6-1

반응형