Nativescript - получить идентификатор метки по индексу

Question

На самом деле я не знал, как лучше описать название этого вопроса, но я постараюсь объяснить себя как можно лучше:

Я создаю приложение, в котором пользователи будутбыть в состоянии заказать еду, и она будет доставлена ​​на дом, поэтому в определенный момент у меня есть список меню, и в этом списке есть группы продуктов питания (группа лосося, группа пасты и т. д. это приложение для суши).

Итак, допустим, я выбрал лосося, у меня будет список, который выглядит следующим образом:

Ну, какВы можете видеть там счетчик и его функцию, я думаю, что это очевидно, и код, который я использую для приращения еды, приведен ниже:

<GridLayout row="2" rowSpan="2" col="2" rows="*" columns="40,25,40" verticalAlignment="center" horizontalAlignment="right" marginRight="10">
                    <Label row="0" col="0" text="+" tap="onTapPlus" verticalAlignment="center" horizontalAlignment="center" style="color:black;font-family: 'Allerta Stencil', sans-serif;font-size:20px;"></Label>
                    <Label id="nrItemsTakeAway" row="0" col="1" text="0" verticalAlignment="center" horizontalAlignment="center" style="color:black;font-family: 'Allerta Stencil', sans-serif;font-size:20px;"></Label>
                    <Label row="0" col="2" text="-" tap="onTapMinus" verticalAlignment="center" horizontalAlignment="center" style="color:black;font-family: 'Allerta Stencil', sans-serif;font-size:20px;"></Label>
</GridLayout>

У меня есть событие касания длякнопка плюс, и у меня есть событие касания кнопки минус, и оба будут влиять на метку с идентификатором nrItemsTakeAway ... но вы уже догадались, что идентификатор должен быть уникальным для каждой записи в просмотре списка ... как я буду отличать это?

Ps: я использую javascript

С уважением

Answer 1

Если вы используете NativeScript Core для разработки, вы должны использовать Observable для привязки ваших данных.

Например,

ViewModel

import { Observable, fromObject } from 'tns-core-modules/data/observable';
import { ObservableArray } from 'tns-core-modules/data/observable-array';

export class HomeViewModel extends Observable {
    items: ObservableArray<Observable> = new ObservableArray([
        fromObject({ name: "Item 1", count: 1 }),
        fromObject({ name: "Item 2", count: 1 }),
        fromObject({ name: "Item 3", count: 1 }),
        fromObject({ name: "Item 4", count: 1 }),
    ]);

    onPlusTap(args) {
        args.object.bindingContext.count += 1;
    }

    onMinusTap(args) {
        args.object.bindingContext.count -= 1;
    }

    constructor() {
        super();
    }
}

XML

<ListView class="list-group" items="{{ items }}">
        <ListView.itemTemplate>
            <FlexboxLayout flexDirection="row" class="list-group-item">
                <Button text="+" class="font-weight-bold" tap="{{ $parents['ListView'].onPlusTap, $parents['ListView'].onPlusTap }}"></Button>
                <Label class="h3" text="{{ count }}"></Label>
                <Button text="-" class="font-weight-bold" tap="{{ $parents['ListView'].onMinusTap, $parents['ListView'].onMinusTap }}"></Button>
            </FlexboxLayout>
        </ListView.itemTemplate>
    </ListView>

Каждый элемент в элементах теперь является наблюдаемым, обновление атрибута также обновит элемент пользовательского интерфейса.

Answer 2

Чтобы реализовать это, вам нужно использовать пользовательскую модель представления и Привязка данных вместо прямого манипулирования текстовым значением Label.