大家好,我是OB。
故不积洼步,无以至千里。今天给大家分享一下native和js的交互。
用到了一个小工具:OBJSBridge
支持pod 集成 : pod 'OBJSBridge'
如果不想用pod,也可以直接把源码拖到项目中去。只需要OBJSBridge.h
OBJSBridge.m
就可以了。代码地址
记得star哟。
最近项目中加载了很多HTML页面,所以native
和js
的交互显得格外重要。
最主要运用场景是:客户端登录,如何把用户的登录信息传递给js
;另一面在商品详情页(html
)中选购的商品id
如何传递给native
,在原生页面发起订单及付款;
1. OC 向 JS 传递参数,可以是字典,也可以是字符串。
代码如下
[[OBJSBridge shareBridge] registerPushFunction:@"pushUserId" webView:self.wkwebView params:@{@"userID": @"2345432"}];
注意:动态向js
传入参数,需要把握时机,就是等到textfield.text
有值了,再向js
中注入方法。
当方法注入了js中,js就可以直接使用方法了。
if (typeof(pushUserId) === 'function') {
this.info = pushUserId();
}
pushUserId()
这里就是oc
注入的方法,js
直接使用。该方法的返回值就是oc
传过去的参数。
2. JS 向OC传递参数,可以是字典,也可以是字符串。
前提是oc向js中注入方法,该方法有回调,
[[OBJSBridge shareBridge] registerReceiveFunction:@"getJSProductUser" webView:self.wkwebView didReceiveScriptMessage:^(WKScriptMessage * _Nonnull message) {
NSLog(@"getJSProductUser:%@",message.body);
}];
b:方法注册完成后,js直接调用方法,并传递参数。
if (typeof(getJSProductUser) === 'function') {
getJSProductUser({"userName":"lishuyang","usreID":"32345"});
}
getJSProductUserr({"userName":"lishuyang","usreID":"32345"})
该方法也可在js直接调用,因为oc已经将方法注入到js中。
可在控制台看到js传过来的参数
好了,今天就到这里了,下期再见。