Search code examples
vue.jsnativescript

Access special Layout from outside of a Component (NativeScript + Vue)


my app consists of:

6 components in component folder,

3 JS files in library folder.

inside of component_1 I have a Layout with ref myLayout, one of those JS files myLayoutHandler manipulate myLayout (animate it or other stuffs) , when this JS file runs inside component_1 it works. ( it uses : this.$refs.myLayout.nativeView and this is my problem ) but when it runs inside other components due to the this.$refs. it will not find the myLayout.

So how can I access myLayout all over the app? Is there something like: global.$refs, or some method like getElementbyId?


Solution

  • You may always use the {N} way of identifying elements. Use id instead of ref and call getViewById(yourId) on the Page instance.

    The current page can always be accessed from any element Or frame.

    Edit:

    If you prefer Vue way of accessing still, you may use $root or $parent, but for every parent above the current component, you will have to chain them.