programing

nuxt plugins 글로벌 메서드의 typescript 정의에 유형이 있습니까?

copysource 2022. 8. 11. 23:45
반응형

nuxt plugins 글로벌 메서드의 typescript 정의에 유형이 있습니까?

Vuex 스토어 인스턴스에서도 액세스 가능해야 하기 때문에 주입 속성에 의해 정의된 글로벌 메서드를 제공하는 Nuxt.js 플러그인을 작성했습니다.형식 정의 파일을 작성했습니다.이 파일은 에 포함되어 있습니다.tsconfig.json페이지와 같이 Nuxt.js 어플리케이션에서 이 글로벌 메서드에 접속하면 입력은 예상대로 동작합니다.스토어내의 액션 메서드로 이 메서드에 액세스 하려고 하면, 타입 any 가 됩니다.의 유형을 확대하려면 어떻게 해야 합니까?vuex/types/index.d.ts인텔리센스 지원 및 올바른 타이핑으로 내 메서드에 접근할 수 있습니까?이거 정말 좋겠다.

Moritz씨께 안부 전해 주세요.

테스트한 내용:

가이드를 읽고 플러그인 유형의 정의를 완료할 수 있었습니다.마찬가지로 Vuex에서도 이 작업을 수행해야 하는데 어떤 모듈을 사용해야 하는지 알 수 없습니다.

plugin-web-connection.ts:

export default ({store, isHMR, app}, inject) => {

  app.store.registerModule('oauth', oAuthStore);
  app.store.registerModule('app-config', appConfigStore);

  inject("getOAuthCredentials", function(stringProp: string) : string {

    console.log("This is an example for getting oAuth: ", stringProp);
    return stringProp;
  });

  inject("doWebRequest", function<T>(method: string, params: any) : 
Promise<T> {
 // content of method does not matter
    }

plugin-web-connection.d.ts:

// 1. Make sure to import 'vue' before declaring augmented types
import Vue from 'vue'

// 2. Specify a file with the types you want to augment
//    Vue has the constructor type in types/vue.d.ts
declare module 'vue/types/vue' {
  // 3. Declare augmentation for Vue
  interface Vue {
    $getOAuthCredentials(stringProp: string): string,
    $doWebRequest<T>(method: string, params: any, storeCommit: string): 
Promise<T>
  }
}

menu-store.ts:

export const state = (): sabioTree => ({

});

export const mutations = {
    setMenu(state: sabioTree, newState: sabioTree) {}
}

export const actions = {

    retrieveMenu(context: any, data: any) {

        var method: string = data.method;
        var parametersObj: any = data.parameters;
        var storeCommit: string = data.storeCommit;

        debugger;

        // this is underlined red by VS-Code because of the generic!! this.$doWebRequest has type any
        this.$doWebRequest<sabioTree>(method, parametersObj, storeCommit).
        then(function(s) {})
    }
 }

언급URL : https://stackoverflow.com/questions/57395180/typescript-definition-of-nuxt-plugins-global-methods-has-type-any

반응형