Javascript 组件可以'；t从Vue实例v-on调用方法：单击

我是Vuejs的新手，我只想从我的Vue实例调用methode，但这似乎是一个问题，我不知道为什么

Vue实例：

var monster=新的Vue({
el:“#怪物列表”，
数据：{
怪物：未定义
},
已创建：异步函数（）{
this.monsters=等待这个.loadMonster（）
},
方法：{
loadMonster:异步函数（）{
//东西
},
deleteMonster:异步函数（id）{
//东西
}
}
})

组成部分：

Vue.component（'monster'{
模板：“{monster.name}无怪物图像删除”，
道具：[“怪物”]
})

我想调用deleteMonster（）方法，使用组件中声明的按钮调用我的怪物id

下面是我得到的错误：

vue@2:6 ReferenceError: deleteMonster is not defined
    at click (eval at Ya (vue@2:6), <anonymous>:3:451)
    at He (vue@2:6)
    at HTMLButtonElement.n (vue@2:6)
    at HTMLButtonElement.Yr.o._wrapper (vue@2:6)

vue@2：6引用错误：未定义deleteMonster
在单击时（在Ya处评估）(vue@2:6), :3:451)
在他(vue@2:6)
在HTMLButtonElement.n(vue@2:6)
在HTMLButtoneElement.Yr.o.\U包装上(vue@2:6)

您需要

向父组件
monsterlist
发出一个事件，该组件调用其
删除monster
函数，传递自定义
id
，如下所示：


const monster=Vue.component（'monster'{
模板：“#怪物”，
道具：[“怪物”]
})
新Vue({
el:“#怪物列表”，
组件：{monster}，
数据：{
怪物：未定义
},
已创建：异步函数（）{
this.monsters=等待这个.loadMonster（）
},
方法：{
loadMonster:异步函数（）{
返回[
{u id:1}，
{u id:2}，
];
},
deleteMonster:异步函数（id）{
console.log（id）；
}
}
})

{{monster.name}
没有怪物形象
删除