itsource

키가 'StoreOptions' Vuex 4 + Vue 3 + Typescript 유형에 없습니다.

mycopycode 2023. 6. 16. 21:43
반응형

키가 'StoreOptions' Vuex 4 + Vue 3 + Typescript 유형에 없습니다.

Typescript와 Vue3가 있는 Vuex 4 Store를 설정하고 싶습니다.저는 타자기에 대한 경험이 거의 없습니다.

초기 설정을 위해 Vuex 튜토리얼을 따라 거의 복사 붙여넣기 작업을 수행했습니다.유일하게 다른 요소는 내 안에 있다는 것입니다.State인터페이스 유형의 키가 있습니다.Station.

이 오류가 발생했습니다.

TS2345: Argument of type '{ station: {}; isOverlayActive: boolean; }' is not assignable to parameter of type 'StoreOptions<State>'.
  Object literal may only specify known properties, and 'station' does not exist in type 'StoreOptions<State>'.

이것은 나의Station인터페이스

export default interface Station {
  uuid: string;
  name: string;
  teaser: {
    src: string;
    title: string;
  };
  event: {
    uuid: string;
    name: string;
    logo: {
      src: string;
      title: string;
    };
  };
  logo: {
    src: string;
    title: string;
  };
  theme: {
    mainColor: string;
    textColor: string;
  };
}

그리고 이것은 나의index.ts내가 스토어를 정의하는 위치와 오류가 발생하는 위치

import { InjectionKey } from "vue";
import { createStore, useStore as baseUseStore, Store } from "vuex";
import Station from "@/interfaces/station";

export interface State {
  station: Station;
  isOverlayActive: boolean;
}

export const key: InjectionKey<Store<State>> = Symbol();

export const store = createStore<State>({
  station: {}, // here the compiler shows the error
  isOverlayActive: false,
});

export function useStore(): Store<State> {
  return baseUseStore(key);
}

내 생각에 그것은Station문제를 일으키는 것이 아닙니다, 저는 또한 설정하려고 노력했습니다.station: number에서Store인터페이스 및 설정station: 0store하지만 저도 같은 오류가 발생합니다.

내가 뭘 잘못하고 있는 거지?목표는 타이핑된 상점을 갖는 것입니다.

에서createStore속성에 포장하는 데 필요한 기능state.

https://vuex.vuejs.org/guide/typescript-support.html#simplifying-usestore-usage

대신에

export const store = createStore<State>({
  station: {}, // here the compiler shows the error
  isOverlayActive: false,
});

그건…

export const store = createStore<State>({
  state: {
    station: {},
    isOverlayActive: false,
  }
});

다음 이후에도 오류가 발생합니다.uuid,name등은 다음에 의해 정의되지 않습니다.{}하지만 그것은 또 다른 오류입니다.

언급URL : https://stackoverflow.com/questions/71839700/key-does-not-exsists-in-type-storeoptionsstate-vuex-4-vue-3-typescript

반응형