How to get the view or component object using its name in Vue js?
From the VueJS guide
Despite the existence of props and events, sometimes you might still need to directly access a child component in JavaScript. To achieve this you have to assign a reference ID to the child component using
ref
. For example:
var parent = new Vue({ el: '#parent' })// access child component instancevar child = parent.$refs.profile
<div id="parent"> <user-profile ref="profile"></user-profile></div>
It's easy. You can access the topComponent
just using Vue.component
.
var topComponent = Vue.component('top');
Now you have topComponent
, you can do a lot of things with its methods.
cidoptionssuperextenddirectivefilterpartialtransitioncomponent
You may want to check out this example:
It uses the v-view directive in the html, which takes a string to change the viewmodel displayed. Some sweet transitions going on as well.
Comes from: https://github.com/yyx990803/vue/blob/master/test/functional/fixtures/routing.html