Question

我在进入NativeScript时遇到了困难。通过XML类型的标签来实现UI元素，我对UI方面了如指掌。但是我不确定如何在后面的代码中将UI转换为实际的功能程序。

例如，如果我的应用程序中具有以下按钮，则我不确定为Tap事件连接事件处理程序的语法：

<Page loaded="pageLoaded" class="page" xmlns="http://www.nativescript.org/tns.xsd">

<ActionBar title="Home" class="action-bar">
</ActionBar>

<TabView>
    <TabViewItem title="Tab 1">
        <StackLayout>
            <Button id="btn_Woohoo" text="Button WooHoo" tap="btn_woohoo_tap" />
        </StackLayout>
    </TabViewItem>
    <TabViewItem title="Tab 2">

    </TabViewItem>
</TabView>

我已经看到了几种不同的语法实现，例如：

1) tap="methodName"
2) tap="{{ methodName }}"
3) {tap}="methodName"
4) {tap}="{{ methodName }}"
5) tap="methodName()"

在我看到它们的地方都没有解释这些实现，当我尝试它们时它们也不起作用。

在后面的代码中，我尝试了几种不同的语法方式来编写事件处理程序方法，但似乎也没有一种对我有用。

这是我当前的实现方式：

export function btn_woohoo_tap(args: EventData) {
    //alert("Woohoo!");
    //btn_Woohoo.text
    //let woohooButton = this.getViewById('btn_Woohoo');
    //woohooButton.text = "test";
}

Answer 1

这应该有效，如果您仍然有问题，请分享一个Playground示例，可以重现该问题。

XML

<Button id="btn_Woohoo" text="Button WooHoo" tap="btn_woohoo_tap" />

TS

export function btn_woohoo_tap(args: EventData) {

}

另一种可能的语法是tap="{{ btn_woohoo_tap }}"，这意味着该函数是从ViewModel绑定的，而不是文件后面的代码。 Here you find the relevant docs。我认为您问题中其余的语法无效。

如何将按钮的Tap事件连接到NativeScript中的事件处理程序？

1 个答案: