iOS 点击js按钮调本地oc方法

最近刚好在写h5交互,过程中走了点弯路,大脑进了死胡同,特此记录下来避免更多的人走弯路。

需求:点击webview中的按钮,js会调我们oc本地的方法,同时会穿参数给我们,我们跳转下一个页面需要用到。

跟之前接触的h5交互需求上略有不同,之前都是网页加载完了,就直接调本地的方法,所以一下子就陷入了怎样捕捉js按钮点击事件的方法的深思中,其实没有想的那么复杂。

不多赘述,直接看图

iOS 点击js按钮调本地oc方法_第1张图片

如图,我们需要在点击立即兑换按钮的时候,获取到我们点击的那个item的类型以及相关参数,以便跳转到我们本地的商品详情页。

首先,我们先去新建一个类,然后给这个类添加代理方法,需要注意的是,这个协议一定要遵守协议


iOS 点击js按钮调本地oc方法_第2张图片

而协议里面的方法,就是我们跟h5协商好的方法名。

那么问题又来了,我们当初跟后台约定的时候,只有一个方法名,没有带参数,怎么办呢?

请看这里:

iOS 点击js按钮调本地oc方法_第3张图片

此处的JSExportAs,可以将约定的方法名与我们本地的方法绑定在一起,这样我们就可以写一个带有参数的方法,作为约定方法的别名。然后就可以获取到后台传来的参数啦!

注意:作为别名的方法携带的参数必须跟后台返回的参数保持一致。

咱们接着来看一下vc里面要写些什么


iOS 点击js按钮调本地oc方法_第4张图片
iOS 点击js按钮调本地oc方法_第5张图片

对的,vc里面就只需要写这么多,到此我们就可以实现js与oc的交互啦!咱们来看一下效果:

iOS 点击js按钮调本地oc方法_第6张图片

咱们已经可以成功获取到后台返回的参数喽!

希望友友们也可以在h5交互的道路上不走弯路,一帆风顺!

附上demo地址:https://github.com/Angela941022/js-ocDemo.git

你可能感兴趣的:(iOS 点击js按钮调本地oc方法)