事件未从子级到达父级组件

Question

我将事件发送到父组件。单击列表元素时，将使用v-model指令处理切换。此外，我还需要有关是否已选择列表元素在父级中进行v-if渲染的信息。我在孩子中使用了发射以及方法和计算道具。都给我留下了错误。我不知道如何解决这个问题。

-此外，尽管父级依赖于子级事件，但我需要分享父级组件在子级之前渲染的情况。

-我也在控制台上收到Error in v-on handler: "TypeError: _vm.updateKumas is not a function"错误消息。

-此图像还显示了父组件的事件：

这是代码

子组件

<template>
  <v-card class="pa-2" height="225" width="150" flat>
    <v-btn disabled block small>Kumaş Tipi</v-btn>
    <v-list dense>
      <v-list-item-group v-model="kumas" color="primary">
        <v-list-item v-for="(item, i) in items" :key="i" class="my-list-class">
          <v-list-item-content>
            <v-list-item-title
              v-text="item.text"
              @click="changeKumas"
            ></v-list-item-title>
          </v-list-item-content>
        </v-list-item>
      </v-list-item-group>
    </v-list>
  </v-card>
</template>

<script>
export default {
  data: () => ({
    kumas: null,
  }),
  props: ["items"],

  methods: {
    changeKumas() {
      this.$emit("changeKumas", this.kumas);
    },
  },
};
</script>

父组件

<template>
  <div>
    <v-card>
      <v-container>
        <v-row>
          <v-col cols="12">
            <v-row
              align="start"
              justify="start"
              style="height: 300px; width: 1200px"
            >
              <Kumas :items="items" @changeKumas="updateKumas($event)" />
              
            </v-row>
          </v-col>
        </v-row>
      </v-container>
    </v-card>
  </div>
</template>

<script>
import Kumas from "./ListingComponents/Kumas";

export default {
  data: () => ({
    kumas: null,
    items: [
      { text: "İtem1", icon: "mdi-clock" },
      { text: "İtem2", icon: "mdi-account" },
      { text: "İtem3", icon: "mdi-flag" },
      { text: "İtem1", icon: "mdi-clock" },
      { text: "İtem2", icon: "mdi-account" },
      { text: "İtem3", icon: "mdi-flag" },
    ],
  }),
  methods: {
    updateKumas(updatedKumas) {
      console.log(` Kumas in step1 is ${updatedKumas}`);
      this.kumas = updatedKumas;
      console.log(` Kumas in step1 is ${this.kumas}`);
    },
  },
  components: { Kumas },
};