Nativescript FormattedString - 跨度上的点击事件

dpd*_*nev 5 nativescript

我有以下标记:

<StackLayout paddingLeft="15" paddingRight="15" dock="top" >
  <Label textWrap="true">
    <Label.formattedText>
      <FormattedString>
        <FormattedString.spans>
          <Span text="By checking 'yes' I understand that this is a legally valid and binding written agreement, and I indicate that I have read, understand, and agree to the terms of my " />
          <Span text="Agreement. " foregroundColor="#3aba90" tap="viewAgreemnent" />
          <Span text="Also, by checking 'yes', I certify that I have read and agree to accept electronically the "  />
          <Span text="Privacy Policy." foregroundColor="#3aba90" tap="viewPolicy" />
        </FormattedString.spans>
      </FormattedString>
    </Label.formattedText>
  </Label>
</StackLayout>
Run Code Online (Sandbox Code Playgroud)

这将创建一个文本块,其中协议和隐私政策以不同的颜色呈现。目标是当用户点击它们以执行显示协议或策略的功能时。问题是跨度不会触发点击事件。此事件是否在此级别或仅在顶级标签级别可用?

关于如何实现这一点的任何想法?

谢谢。

til*_*ers 5

SpanNativeScript 中的元素没有触摸事件,您可以在 api 文档中阅读:https://docs.nativescript.org/api-reference/classes/_ui_text_base_span_.span

然而,有一个拉取请求来实现这样的功能:https ://github.com/NativeScript/NativeScript/pull/8256

同时,解决方法(注意:我使用的是 nativescript-vue)如下所示。虽然显然远不理想,但它会产生期望的结果:

<FlexboxLayout flexWrap="wrap">
    <Label text="I " />
    <Label text="accept " />
    <Label text="the " />
    <Label text="Terms of Service" textDecoration="underline" @tap="open('https://example.com')" />
    <Label text=" and " />
    <Label text="the " />
    <Label text="Privacy Policy" textDecoration="underline" @tap="open('https://example.com')" />
    <Label text="." />
</FlexboxLayout>
Run Code Online (Sandbox Code Playgroud)

以下是open()在浏览器中打开提供的 URL 的函数:

import * as utils from "tns-core-modules/utils/utils";

open(url) {
  utils.openUrl(url);
}
Run Code Online (Sandbox Code Playgroud)

2020 年 6 月更新:

Span 元素现在支持linkTapEvent。您可以阅读测试来了解它是如何使用的。不幸的是,我还无法构建 Playground 演示。