IT이야기

Vue 3 및 Typecript - 메서드에서 데이터 속성에 액세스할 수 없음

cyworld 2022. 3. 27. 14:12
반응형

Vue 3 및 Typecript - 메서드에서 데이터 속성에 액세스할 수 없음

나는 내가 쓰는 방법으로 나의 데이터에 접근하려고 노력하지만, 그것은 효과가 없는 것 같다.TS2339 Typecript 오류가 발생했는데, TS2339 Typecript에는 속성이 존재하지 않는다고 나와 있다.

TS2339: Property 'players' does not exist on type '{ onAddPlayers(): void; getPlayerPlaceholder(index: number): string; }'.   
    47 |   methods: {
    48 |     onAddPlayers() {
  > 49 |       this.games = prepareGames(this.players as PadelPlayer[]);
       |                                      ^^^^^^^
    50 |     },
    51 |     getPlayerPlaceholder(index: number) {
    52 |       const playerNumber = Number(index) + 1;

구성 요소의 코드:

<script lang="ts">
import { PadelGame } from "@/models/padelGame.interface";
import { getPadelPlayers, prepareGames } from "../services/americanoService";
import { PadelPlayer } from "@/models/padelPlayer.interface";

const padelGames: PadelGame[] = [];

export default {
  data() {
    return {
      players: getPadelPlayers(),
      games: padelGames,
    };
  },
  methods: {
    onAddPlayers() {
      this.games = prepareGames(this.players as PadelPlayer[]);
    },
    getPlayerPlaceholder(index: number) {
      const playerNumber = Number(index) + 1;
      return "Spelare " + playerNumber;
    },
  },
};
</script>

유형을 확인하려면 다음을 사용하여 구성 요소 인스턴스를 생성하십시오.defineComponentvue에서 가져오기:

<script lang="ts">
import { PadelGame } from "@/models/padelGame.interface";
import { getPadelPlayers, prepareGames } from "../services/americanoService";
import { PadelPlayer } from "@/models/padelPlayer.interface";
import {defineComponent} from 'vue'
const padelGames: PadelGame[] = [];

export default defineComponent({
  data() {
    return {
      players: getPadelPlayers(),
      games: padelGames,
    };
  },
  methods: {
    onAddPlayers() {
      this.games = prepareGames(this.players as PadelPlayer[]);
    },
    getPlayerPlaceholder(index: number) {
      const playerNumber = Number(index) + 1;
      return "Spelare " + playerNumber;
    },
  },
});
</script>

참조URL: https://stackoverflow.com/questions/65072226/vue-3-and-typescript-cannot-access-data-property-in-a-method

반응형