コンポーネントにオリジナルイベントをバインドする

サブアセンブリにオリジナルのイベントを追加したい場合は、@click.native=""を使用します.

    
    
    


    

        
    
    
        var counter = {
            template : '<div>{{content}}</div>',
            data : function(){
                return {
                    content : "hello world"
                }
            }
        }
        var vm = new Vue({
            el : "#app",
            components : {
                counter : counter
            },
            methods : {
                handleClick : function(){
                    alert('click');
                }
            }
        })
    

    
    
    


    

        
        
    
    
        var counter = {
            template : '<div @click="handleChildClick">{{content}}</div>',
            data : function(){
                return {
                    content : "hello world"
                }
            },
            methods : {
                handleChildClick : function(){
                    alert("child click");
                    //               
                    this.$emit("click");
                }
            }
        }
        var vm = new Vue({
            el : "#app",
            components : {
                counter : counter
            },
            methods : {
                handleClick : function(){
                    alert('click');
                }
            }
            
        })