关于 Weex 自定义(原生事件)和(原生控件)流程
从去年11月份,开始捣鼓 Weex 相关的一些东西,直到现在也踩了不少的坑,前两天在公司内部搞了个小分享,现在把分享的部分东西贴出来供大家参考。
前提是:你 iOS 工程中已经接入了 WeexSDK,如果还没接入可以查看我的另一篇博客,地址:http://www.cnblogs.com/shisishao/p/6439850.html,有集成 WeexSDK 到工程中的方法;
一、自定义事件Module流程:
1、自定义事件Module(客户端准备):
1.1、先自定义 module 类,然后必须遵循 WXModuleProtocol 协议
1.2、必须添加宏 WX_EXPORT_METHOD, 它可以被 weex 识别,它的参数是 JavaScript 调用 module 指定方法的参数
1.3、添加 @synthesized weexInstance,每个moudle对象被绑定到一个指定的实例上
1.4、Weex 的参数可以是 String 或者Map
1.5、Module 支持返回值给 JavaScript中的回调,回调的类型是 WXModuleCallback, 回调的参数可以是 String 或者 Map
2、注册 module(Weex 和 Native 建立连接)
通过调用 WXSDKEngine 中的 registerModule:withClass 方法来注册自己的 module,例如:
[WXSDKEngine registerModule:@"event" withClass:NSClassFromString(@"WXEventModule")];
注册完之后,也就是已经和Weex建立了连接。
二、自定义原生控件流程:
1、自定义控件(客户端准备):
1.1、先创建一个继承自WXComponent的类重写以下方法:
- (instancetype)initWithRef:(NSString *)ref type:(NSString *)type styles:(NSDictionary *)styles attributes:(NSDictionary *)attributes events:(NSArray *)events weexInstance:(WXSDKInstance *)weexInstance;
// 加载控件
- (UIView *)loadView;
// 更新样式
- (void)updateStyles:(NSDictionary *)styles;
// 回传数据:
- (void)fireEvent:(NSString *)eventName params:(NSDictionary *)params;
2、注册控件(Weex 和 Native 建立连接):
2.1、注册一个 component ,调用 WXSDKEngine 中的 registerComponent:withClass: 方法。
2.2、Native注册:
[WXSDKEngine registerComponent:@"show_image_view" withClass:NSClassFromString(@"KBHShowImageViewWXComponent")];
2.3、Weex实现:
<show_image_view class="my_cus_view"
@refresh="onrefresh"
:style="{ height: after_height + 'px'}"
value="show"
view_id="2"
:imglist="afterMedia"></show_image_view>
// 实现该方法
onrefresh: function (result) {}
如果转载,请注明出去:http://www.cnblogs.com/shisishao/p/Weex.html