此h5主要是重构xx公司到家业务中电子小票有关售后申请退货流程的h5项目,内嵌到公司 app 和微信小程序中用的。项目主要使用 vue3.0+vite3+ts+scss 构建。里面的功能主要包含退货商品的选择、退货申请、跳转支付运费、退货审核流程、退货物流的选择和查看等等。
由于项目是内嵌在 IOS、Android和微信小程序三端的,基于安全和权限的考虑,在整个项目中,诸如图片上传、地址选择、物流单号扫一扫等功能,都使用了原生的功能。
与app原生交互,主要使用了 js桥接功能,在 window上挂载了一个 THJSBridge 的对象,app 在这个对象中创建了一个 postMessage 的方法,h5上这个对象中创建了 receiveMessage 的方法。当h5想要使用原生的任何功能,通过调用 postMessage 方法,传入action和相关传参,原生 app 上对这个方法进行监控并且做相应的处理,在需要处理结果时,会使用receiveMessage方法对h5传达处理结果。
与微信小程序交互,大部分都是使weixin-js-sdk 调用微信的原生方法。
点击空白处退出提示
评论