vue2调用使用$父功能从组件

我试图调用从子组件父方法发出，但似乎不工作..下面的代码：

的index.html

<div class="percorso"v-on:removeall="pathlengthTozero()"> 
</div>

部件

Vue.component('lista-percorso', { 
template:` 
<div class="col-lg-2 col-xs-2"> 
    <div class="removeall pull-right" v-on:click="removeall()"></div> 
</div>`, 

    methods:{ 
    removeall : function(){ 
     this.listaSelezionati = []; 
     this.$emit('removeall'); 
    } 
}

父方法

pathlengthTozero : function(){ 
     il_tuo_percorso = ['']; 
    }

似乎“pathlengthTozero”不叫上发出这就是使用它的正确方法？

来源

2017-07-28 Pds Ink

您可以使用V-上听到DOM事件。 v-on：removeall没有任何意义。 –

你在哪里使用这个'lista-percorso'组件？ –

你需要把这个v-on:removeall="pathlengthTozero"到组件<lista-percorso>像下面，

<lista-percorso v-on:removeall="pathlengthTozero"></lista-percorso>

和this.$emit将能够触发父类的方法。

样品展示：

Vue.component('lista-percorso', { 
 
template:` 
 
<div class="col-lg-2 col-xs-2"> 
 
    <div class="removeall pull-right" v-on:click="removeall()">xxxxxxxxxx</div> 
 
</div>`, 
 

 
    methods:{ 
 
    removeall : function(){ 
 
     this.listaSelezionati = []; 
 
     this.$emit('removeall'); 
 
    } 
 
    } 
 
}) 
 

 

 

 
var App = new Vue({ 
 
    el: '#app', 
 
    methods:{ 
 
    pathlengthTozero : function(){ 
 
     alert('hello'); 
 
     il_tuo_percorso = ['']; 
 
    } 
 
    } 
 
});

<script src="https://unpkg.com/vue"></script> 
 

 
<div id="app"> 
 
    <div class="percorso" ></div> 
 

 
    <lista-percorso v-on:removeall="pathlengthTozero"></lista-percorso> 
 
</div>

来源

2017-07-28 10:59:09

你应该把事件侦听器放在孩子conponent它是用来

<div class="percorso"> 
    <lista-percorso v-on:removeall="pathlengthTozero"></lista-percorso> 
</div>

来源

2017-07-28 11:02:09

vue2调用使用$父功能从组件

回答

相关问题