Calling a Vue.Js component method from outside

If you are trying to integrate an already existing page to a view component you might want to call the component from the existing page. To refer a method that belongs to one of the child components of the main Vue instance you can use Vue’s ref directive.

var vm = new Vue({

    el: '#app',

    components: {‘my-Component’: myComponent}


<my-Component ref="p">hello</my-Component>
<!--<child-component ref="child"></child-component>-->


vm.$refs.p.mymethod ();


After executing this code there will be a 'vm is undefined' error if you are using web pack because of the way it scopes the modules so add in main.js.