phương pháp truy cập mẹ từ mẫu thành phần trong vuejs

Question

tôi có mã này:

 new Vue({ 
     el: '#app', 
     components: { 
      'app-component': AppComponent 
     }, 
     data: { 
      message: 'Hello Vue.js!' 
     }, 
     methods: { 
      doSomething: function(){ 
       console.log('arrived!') 
      } 
     } 
    }) 

Làm thế nào tôi có thể gọi là "doSomething" phương pháp từ AppComponent html mẫu? như thế này:

<app-component> 
    <a href="#" v-on:click="doSomething()">text</a> 
</app-component> 

tôi nhận được lỗi này:

Uncaught TypeError: scope.doSomething is not a function

Answer 1

Bạn có thể sử dụng $ công văn từ đứa trẻ để kích hoạt một sự kiện. Ví dụ:

// App component 
<app-component> 
    <a href="#" v-on:click.prevent="$dispatch('do-something')">text</a> 
</app-component> 


// Parent 
new Vue({ 
    el: '#app', 
    components: { 
     'app-component': AppComponent 
    }, 
    data: { 
     message: 'Hello Vue.js!' 
    }, 
    events: { 
     'do-something': function(){ 
      console.log('arrived!') 
     } 
    } 
}); 

Để biết thêm về thông tin liên lạc giữa phụ huynh và trẻ em, kiểm tra tài liệu: http://vuejs.org/guide/components.html#Parent-Child-Communication

Answer 2

Ngoài phản ứng Wiljan, tôi mở rộng tất cả các thành phần với dụ Vue mới có phương pháp và dữ liệu. Bây giờ tôi tiếp cận với các phương pháp và vv

Answer 3

thử v-on:click="$parent.doSomething()"

Answer 4

Bạn có thể sử dụng, dựa trên this answer.

this.$parent.$options.methods.someParentMethod(data)