一、简述
最近项目组打算引入weex,并选定了一个页面进行试水。页面很简单,主要是获取数据渲染页面,并可以跳转到指定的页面。跟之前使用RN 相比,weex 确实要简单很多。从下图中我们可以看到,weex 页面需要跳转到原生页面,并且跳转到哪个页面我们可能并不能写死。也就是说只要原生页面之前项目中写过了,那么理论上来说使用weex 可以任意调用。那么问题来了,我原来的页面可能只知道名字,我怎么为那个页面传值呢?比如有个页面orderDetailVC ,跳转时需要传入orderId,即orderDetailVC.orderId = @"123";
二、思考
可能最直接的想法就是直接原生给weex 提供一个方法,让weex 传入orderId,然后再push。但是如果明天我们需要跳转到另一个页面merchantDetailVC呢?它需要的不是orderId了,可能是一个merchantId,甚至更多参数。那怎么才能实现任意跳转呢?我的想法是,项目是我写的,需要跳转到哪个类,那么这个类名我肯定是清楚的,并且这个类应该需要什么参数我也是清楚的。只不过我可能不知道怎么用weex 把它参数传过去而已。如果知道了类名就意味着我知道了这个类,我能找到这个类,那么我就知道这个类有哪些属性了,这个类的所有属性我都能拿到,只不过有些是我需要给它赋值的,有些是不需要处理的。
三、实现
整体的思路是:原生给weex 提供一个通用的跳转方法。参数是类名和属性字典。
//控制器相关 /* vcName: 页面名称 param:页面所需参数(如原来的页面需要传递小区id,工单号等等,字典形式传过去,key 与页面所需参数名称一致即可。 */ -(void)pushViewController:(NSString *)vcName param:(NSDictionary *)param; /* 将APP 当前展示的页面pop */ -(void)popViewController; /* vcName: 页面名称 param:页面所需参数(如原来的页面需要传递小区id,工单号等等,字典形式传过去,key 与页面所需参数名称一致即可。 */ -(void)presentViewController:(NSString *)vcName param:(NSDictionary *)param finish:(WXModuleCallback)callback; /* 将APP 当前展示的页面dismiss */ -(void)dismissViewController:(WXModuleCallback)callback;
提供方法后weex 可以这样调用:
确定了方案之后,剩下唯一的事情就是如何实现给weex 提供的方法。代码如下:
-(void)pushViewController:(NSString *)vcName param:(NSDictionary *)param{ //获取类 Class vcClass = NSClassFromString(vcName); if (vcClass == nil) { return; } BaseViewController *vc = [[vcClass alloc] init]; vc.hidesBottomBarWhenPushed = YES; //属性数量 unsigned int count = 0; //获取属性列表 objc_property_t *plist = class_copyPropertyList(vcClass, &count); for (int i = 0; i<count; i++) { //取出属性 objc_property_t property = plist[i]; //取出属性名称 NSString *propertyName = [NSString stringWithUTF8String:property_getName(property)]; //以这个属性名称作为key ,查看传入的字典里是否有这个属性的value if (param[propertyName]) { [vc setValue:param[propertyName] forKey:propertyName]; } } //释放 free(plist); //获取当前页面控制器 /* 获取当前页面控制器是根据响应链获取的。 */ UIViewController *currentVC = [Utils getCurrentVC]; if ([currentVC isKindOfClass:[UINavigationController class]]) { [(UINavigationController *)currentVC pushViewController:vc animated:YES]; }else{ [currentVC.navigationController pushViewController:vc animated:YES]; } }
经过小规模自测发现是可以实现需求的。但是由于实现时间不长,可能会有不足之处,请谨慎参考。如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对小牛知识库网站的支持!
本文向大家介绍利用Nginx的map指令实现页面跳转,包括了利用Nginx的map指令实现页面跳转的使用技巧和注意事项,需要的朋友参考一下 前言 本文主要介绍了利用Nginx中map指令实现页面跳转的方法,有需要的下面来一起学习学习。 实现方法 在 nginx.conf 的 http 域中添加 map 指令规则,这里包含一个 URL 规则映射文件: map 指令支持引入一个映射文件的方式,这里 r
本文向大家介绍原生JS实现的跳一跳小游戏完整实例,包括了原生JS实现的跳一跳小游戏完整实例的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了原生JS实现的跳一跳小游戏。分享给大家供大家参考,具体如下: 以下说的是闲暇编写的一个小游戏--跳一跳,类似于微信的跳一跳,大体实现功能有: 1.先随机生成地图; 2.按住按钮释放后完成动作并进行判断; 首先po一下代码; 代码如下: 代码主要分为用来绘
本文向大家介绍JavaScript实现页面跳转的几种常用方式,包括了JavaScript实现页面跳转的几种常用方式的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了JavaScript实现页面跳转的几种常用方式。分享给大家供大家参考,具体如下: 第一种: 第二种: 第三种: 第四种: 第五种: javascript中弹出选择框跳转到其他页面 javascript中弹出提示框跳转到其他页面 补
本文向大家介绍spring boot使用thymeleaf跳转页面实例代码,包括了spring boot使用thymeleaf跳转页面实例代码的使用技巧和注意事项,需要的朋友参考一下 前言 在学习springboot 之后想结合着html做个小demo,无奈一直没掌握窍门,在多番的搜索和尝试下终于找到了配置的方法,使用thymeleaf做事前端页面模板,不能使用纯html. thymeleaf介绍
本文向大家介绍vue实现登录后页面跳转到之前页面,包括了vue实现登录后页面跳转到之前页面的使用技巧和注意事项,需要的朋友参考一下 在开发中我们经常遇到这样的需求,需要用户直接点击一个链接进入到一个页面,用户点击后链接后会触发401拦截返回登录界面,登录后又跳转到链接的页面而不是首页,这种问题该如何去做呢? 先说一下我们需要用到的几个API: 1.router.currentRoute:当前的路由
页面跳转可以是打开新的一页,也可以是当前页重定向,还可以是跳转到当前页的某个状态,下面会从打开w文件,打开其它后缀文件,使用路由等几个方面分别介绍一下在X5中的页面跳转。 目录 1、打开w文件 1.1、使用Shell提供的方法 1.2、使用弹出窗口打开 1.3、模拟门户的做法 2、打开html等其它类型的文件 2.1、使用打开w文件的方法 2.2、使用a链接跳转 2.3、页面重定向 2.4、使用w