Question

我有两个组件：MyItem.vue和ChangeItem.vue。我试图在ChangeItem.vue和组件中发出一个事件，并在MyItem.vue组件中捕获它。但是不起作用。

MyItem.vue

<template>
    <v-card>
        <p>Hello</p>
    </v-card>
     <v-card>
        <router-view name="areas.change" v-on:onchangeitem="test"></router-view>
     </v-card>
</template>

<script>
  export default {
    data(){
        return {
          item: [
        }
    },
    methods: {
        test: function() {
            console.log("my event")
        },
        
    },
  }
</script>

ChangeItem.vue

<template>
    <v-row align="center" justify="center" class="pa-15">
        <button @click="onClickBtnValidate">click</button>
    </v-row>
</template>

<script>
export default {
  data() {
    return {
    };
  },
  methods: {
      onClickBtnValidate: function() {
          this.$router.app.$emit('onchangeitem')
      }
  },
  
};
</script>

Answer 1

首先，发出事件足以

this.$emit('onchangeitem')

无论如何，为什么不尝试直接从MyItem组件调用ChangeItem组件，我认为这是您的主要问题，如果要尝试使用此方法，请记住将组件注册在 Components 中。 Vue对象的strong>部分。

从vue-router发出事件

1 个答案: