How to get element in nativescript using vue?

Question

I want to get Image element with id='item' on created.

I can't seem to find anything on google. Most of the tutorial on the internet is using Typescript and always start with page=args.object

export function pageLoaded(args) {
    page = args.object;
    item = page.getViewById("item");
}

Mennolp · Accepted Answer · 2018-08-25 11:03:00Z

9

You can use refrences for this.

Sample xml:

<StackLayout ~body class="body" row="1">

or:

<StackLayout ref="body" class="body" row="1">

Sample code:

mounted() {
  let body = this.$refs.body;
}

answered Aug 25, 2018 at 11:03

Mennolp

4244 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Mennolp Over a year ago

Also you can access the nativeview by accessing it's property: let nativeLayout = this.$refs.body.nativeView;

GTHell Over a year ago

May I ask, where do you found this? Is it on the official document or vue document?

Mennolp Over a year ago

@GTHell I found this at: github.com/nativescript-vue/nativescript-vue/issues/49 I always try to find a solution for my questions via the nativescript documentation, the vue documentation, the nativescript-vue documentation, the nativescript repository and the nativescript-vue repository. If I can't find anything there I ask the slack community or on Stackoverflow.

Vladimir Amiorkov · Accepted Answer · 2019-04-03 13:08:13Z

6

As mentioned in the comments of the other answers:

<StackLayout ref="body" class="body" row="1">

mounted() {
  let body = this.$refs.body;
}

Also you can access the nativeView by accessing it's property: let nativeLayout = this.$refs.body.nativeView;

In NativeScript-Vue the nativeView of a ViewComponent is the wrapper element of the actual native platform (iOS/Android) element/view.

For example the nativeView of the ref="body" is the StackLayout of the tns-core-modules and it has a nativeViewProtected property which is the actual native framework element (on iOS UIView and android.view.View on Android)

answered Apr 3, 2019 at 13:08

Vladimir Amiorkov

2,9514 gold badges22 silver badges40 bronze badges

Collectives™ on Stack Overflow

How to get element in nativescript using vue?

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related