Не удается захватить события из пользовательского компонента в NS6 - PullRequest
0 голосов
/ 04 ноября 2019

Я использую NS 6.0 Core. Тестирование на физическом устройстве Android (еще не пробовал это на iOS).

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

Внутренний компонент (называемый TopBar):

<StackLayout padding="10" orintation="horizontal" loaded="onLoaded">
  <Label text="&#xe907;" class="wa" fontSize="24" vertcalAlignment="middle" tap="back" />
</StackLayout>
import { StackLayout } from 'tns-core-modules/ui/layouts/stack-layout';
import { EventData } from 'tns-core-modules/ui/core/view/view';

var stack: StackLayout;
let eventData: EventData = {
    eventName: "onBackEvent",
    object: stack
}

export function onLoaded(args) {
    stack = <StackLayout>args.object;
}

export function back() {
    stack.notify(eventData);
}

Хост-компонент

import { Page } from "tns-core-modules/ui/page/page";
import { StackLayout } from "tns-core-modules/ui/layouts/stack-layout/stack-layout";
import { EventData, Observable } from "tns-core-modules/data/observable";

var model: Observable = new Observable();
var page: Page;

export function onLoaded(args: EventData) {
    page = <Page>args.object;

    var topBar: StackLayout = page.getViewById('topBar');
    topBar.on('onBackEvent', () => {
        console.log('go back');
    });

    page.bindingContext = model;
}
<Page xmlns="http://schemas.nativescript.org/tns.xsd" xmlns:tb="components/shared/top-bar/top-bar" loaded="onLoaded" actionBarHidden="true">
    <GridLayout rows="*, 75" columns="*">
        <StackLayout class="page-content">
            <tb:TopBar id="topBar" height="50"></tb:TopBar>

        </StackLayout>
    </GridLayout>
</Page>

Есть идеи о том, чего мне не хватает?

Спасибо

Ответы [ 2 ]

1 голос
/ 10 ноября 2019

{N} автоматически обрезает имена событий, начинающиеся с on, следовательно, onBackEvent будет записано только как BackEvent. Поэтому уведомление onBackEvent не будет иметь никакого эффекта.

По моему мнению, это имеет смысл, даже когда я проверял последний раз, когда Angular не использовал для поддержки имен событий с префиксом on с привязкой к событию. Это также может быть причиной, по которой им пришлось применять это в качестве стандартной меры.

0 голосов
/ 06 ноября 2019

Итак, после нескольких часов проб и ошибок мне удается заставить его работать.

Проблема в том, что при уведомлении клиента мы должны объявить объект EventData следующим образом:

let eventData: EventData = {
    eventName: "BackEvent",
    object: stack
}

Обратите внимание, что мы фиксируем событие, подписавшись на onBackEvent, но установиввверх имя события как BackEvent. Я не уверен, почему это работает или где в документации это написано, но это изменение сделало свою работу.

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

Спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...