vue组件复用时组件中的methods应该如何设置？

Question

Vue.component('alert',{ template:'<button @click="onClick">{{msg_1}}{{msg_2}}{{msg_3}}</button>', props:['msg_1','msg_2','msg_3'], methods:{ onClick:function () { alert(); } } }); new Vue({ el:'#app' }); <div id="app"><alert msg_1="1111111"></alert><alert msg_2="2222222"></alert><alert msg_3="3333333"></alert></div> 我想分别在三个组件中alert出这三个父组件传递的值，也就是1111，2222，3333.那么现在这个onclick方法应该怎么写？？还是说我这个组件的复用本身就写错了吗。。

Answer 1

 onClick:function () {
    let content = this.msg_1 || this.msg_2 || this.msg_3
    alert(content)
 }

Answer 2

Vue.component('alert',{
template:'<button @click="onClick">{{msg_1}}</button>',

props:{
    msg_1: String
},
methods:{
   onClick:function () {
       alert(this.msg_1);
   }
}
});