Nativescript-Vue creating dynamic elements

Question

I was wondering how I could create new elements dynamically like buttons, labels, or textfields which are inside a layout.

I have the following markup:

<AbsoluteLayout ref="abs">
    <Label :text="L('UserClockIn.info.5')" top="10" left="10" />
    <Label class="stk-table-row-data" :text="clockInTimes[0]" top="10" left="100" />
    <Label class="stk-table-row-data" :text="clockInTimes[1]" top="10" left="165" />
    <Label class="stk-table-row-data" :text="clockInTimes[2]" top="10" left="230" />
</AbsoluteLayout>

I am using nativescript-vue with typescript, i want to create a element like another label or button and add it to the absolute layout.

TomG · Accepted Answer · 2019-12-11 09:15:40Z

1

Answered here.

import { Label } from "tns-core-modules/ui/label";

export default {
    methods: {
        addLabel() {
            var label = new Label();
            label.text = "my text";
            // label.top = 10;
            // label.left = 150;
            this.$refs.abs.nativeView.addChild(label);
        }
    }
}

Anyways, it looks like you're creating a grid. Have you considered using a GridLayout?

answered Dec 11, 2019 at 9:15

TomG

5385 silver badges20 bronze badges

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

Collectives™ on Stack Overflow

Nativescript-Vue creating dynamic elements

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related