我经常需要将组件的 `data-*` 属性传递给组件的事件处理函数。假设，swiper 组件下的每个 swiper-item 包含了一个 image。我为每个 image 设置一个 `data-id` 属性，并在 swiper 组件上注册了一个 catchtap 事件函数（冒泡事件）。结果是，当点击图片时，`id` 属性可以传递给 catchtap 事件函数，可是点击指示点时却不能……


```











```


```
onSwiperTap: function(event){
console.log(event);
var id = event.target.dataset.id;
var url = 'pageA/pageA?id=' + id;
wx.navigateTo({
url: url,
})
}
```


我查看了开发文档，并没有发现相关内容的说明。另外，我在开发者社区中（https://developers.weixin.qq.com/blogdetail?action=get_post_info&docid=2fcdb7794d48c59f7624f53e94d0ae22&highline=swiper%20%E6%8C%87%E7%A4%BA%E7%82%B9） 发现以下内容：


>Q：swiper点击指示点切换是需要自己实现吗？扫码支付类微信小程序应该选择什么类型的服务类目+微信小程序开发 ...。


>A：你好，点击指示点切换的功能现已移除。因为手机上面较难点击指示点，容易误点。


如果点击指示点不需要实现特殊的功能，那么：


* 要么就设计为与点击 swiper-item 实现相同的逻辑，包括接收组件的 `data-*` 属性。


* 要么就屏蔽点击指示点来触发事件函数，指示点仅作展示用途。


不管怎样，点击指示点不能将 `data-*` 属性传递给 swiper 的事件函数，对开发者而言还是一个问题；即使在真机上指示点很难点中……


我现在的解决方案是在 swiper 的事件函数中判断一下需要的组件属性否存在，再执行下一个步骤：


```
onSwiperTap: function(event){
console.log(event);
var id = event.target.dataset.id;
if(!id)
return;
var url = 'pageA/pageA?id=' + id;
wx.navigateTo({
url: url,
})
}
```


也许是我知识上有缺漏，或者理解上有偏颇，欢迎大家交流与指教！

微信小程序开发相关问题解答；本文来自微信小程序工厂 http://www.xcxgc.com 转载请保留。

本文网址：http://www.91bianli.com/kaifazhinan/66430.html