【HarmonyOS】FA服务卡片中如何给List添加消息事件
【关键字】
消息事件、JS UI、服务卡片
【介绍】
HarmonyOS使用JS UI进行Java服务卡片开发大家一定不陌生,如果还有没有接触过服务卡片开发的可以参考以下文档:
【技术实现点】
一、FA卡片消息事件
目前使用JS UI服务卡片覆盖了大部分HarmonyOS机型,首先我们回顾一下JS UI卡片提供方处理卡片消息事件的方式。即通过onTriggerFormEvent我们可以把卡片的消息事件在MainAbility中进行处理,具体操作如下。
1. 首先我们在卡片widget的index.hml中给要触发的控件上添加onclick,比如:onclick="sendMessageEvent"
2.然后在index.json中,添加对应的actions,action为“message”的事件将在MainAbility的onTriggerFormEvent函数中触发。
二、新的问题——如何在列表中使用消息事件
但是这样我们就遇到了一个问题,如果我们的卡片是有很多重复元素组成的一个列表list,并且想要把index.json中的data数据与列表绑定,通过点击列表中的item获得此item对应的数据传递到onTriggerFormEvent方法中,该如何操作呢?
三、实现步骤
首先我们需要对index.hml的卡片布局模板做以下改造:
上述代码中我们添加了一个list组件在index.hml中,并且绑定了index.json中的data里面的listdata数据。data部分代码如下:
但是我们的list中只有一个onclick事件,在点击的时候我们希望可以获取到listdata中每一项的url,并将此传递给MainAbility的onTriggerFormEvent,官方文档对此并没有相关的描述。
四、重点来了
其实我们可以通过idx获取到hml页面list的索引,通过item获取其中元素的对应数据。然后把这些数据在index.json的message事件中作为参数,就可以传递给onTriggerFormEvent方法。完整index.json如下:
最后我们在MainAbility的onTriggerFormEvent中添加如下代码就可以获取到item点击传递过来的数据:
【相关参考】
欲了解更多更全技术文章,欢迎访问https://developer.huawei.com/consumer/cn/forum/?ha_source=zzh