wap2app优化返回体验

若当前页面有弹出层,在按下返回键时,原生App会先关闭弹出层;但浏览器中的wap站,却会直接执行history.back(),关闭当前页面,这种体验是不对的;wap2app会智能处理返回逻辑,当用户点击back按键时,先探测当前页面是否存在弹出层,若存在则关闭弹出层,否则关闭当前页面。

但前端写法过于灵活,wap2app目前无法处理所有的弹出层情况,因此wap2app还支持开发者自定义配置;因为弹出层的关闭,一般是通过某个控件的点击事件触发的,比如点击遮罩或点击“取消”按钮;wap2app提供一种简洁的key:value的选择器配置方案,其中:

  • key:弹出层选择器
  • value:点击可触发弹出层关闭的控件选择器
\n

例如:

'shop':{//店铺页面
hostname:'shop.m.dangdang.com',
pathname:/\/\d+\.*html/,
back:{
beforeback:{
'.category_menu':'#j_category'
}
}
}
\n

如上适配代码表示:若.category_menu控件存在且可见,则按下back键时,触发#j_category的click事件;

常见的弹出层场景:

  • 筛选条件
  • 图片预览
\n
1 分享
DCloud_客服_Trust

要回复文章请先登录注册