MUI框架之js和oc互调

mui框架是一个h5框架,当然可以通过普通的js和oc互调,但是他有自己的调用方法,用起来很简单。

一、js调用oc

js调用oc只需要导入对应的类,然后调用方法即可,比如testDemo这个类中有一个单例和两个输出函数

testDemo.m

#import "testDemo.h"
static testDemo*test = NULL;
@implementation testDemo

+(testDemo*)Instantce
{
    static dispatch_once_t onceToken;
    dispatch_once(&onceToken, ^{
        test =[[testDemo alloc] init];
        
    });
    return test;
}

-(void)testss
{
    NSLog(@"testss");
}

-(void)testLog:(NSString*)sss
{
    NSLog(@"%@",sss);
    [self testjs];
}

那么在js中直接可以这么调用即可

var s = plus.ios.importClass("testDemo");
s.Instantce().testss();
s.Instantce().testLog("hudong");

效果:

屏幕快照 2016-09-26 上午8.06.50.png

二、oc调用js

在MUI中,如果oc调用js的话,不太好,有一个变通的方式就是函数在oc中实现,在js中,通过js调用oc的结果来判断,如果非要用oc调用js的话,可以使用oc中的webview的一个stringByEvaluatingJavaScriptFromString的方法,但是这个相当于调用某个html文件中的某个js函数,其他的函数并未调用。就比如页面在a.html中,a.html中有一个变量b需要在a的其他函数中使用,如果这里oc直接调用了js的某个函数,去改变了b值,其实只是修改了当前页面的b值,并没有对a.html整个函数逻辑产生影响,所以现在我的方案就是oc不去调用js的函数,使用js调用oc的结果。

当然这里说下stringByEvaluatingJavaScriptFromString的使用方法,在index.html文件中写入两个函数

function jstest () {
alert("ddddd");
}
function jstest2 (e) {
alert(e);
}

然后在oc中可以这么调用

-(void)testjs{
    self.myweb =[[UIWebView alloc] init];
    NSURL*url = [[NSBundle mainBundle] URLForResource:@"Pandora/apps/HelloH5/www/index.html" withExtension:nil];
    NSURLRequest*request = [NSURLRequest requestWithURL:url];
    self.myweb.delegate =self;
    [self.myweb loadRequest:request];
}

- (void)webViewDidFinishLoad:(UIWebView *)webView
{
     BOOL isExist = [[self.myweb stringByEvaluatingJavaScriptFromString:@"typeof jstest == \'function\';"] isEqualToString:@"true"];
    NSLog(@"%d",isExist);
    [self.myweb stringByEvaluatingJavaScriptFromString:@"jstest();"];
    [self.myweb stringByEvaluatingJavaScriptFromString:@"jstest2(\"hudong\");"];
//    [self.myweb stringByEvaluatingJavaScriptFromString:@"alert('登录成功!');"];
}

self.myweb是一个webview,在这个webview加载完成之后,调用jstest的函数即可

jstest()效果图如下

Simulator Screen Shot 2016年9月26日 上午8.41.50.png

jstest2()效果图如下

Simulator Screen Shot 2016年9月26日 上午8.42.44.png

当然也可以像最后一行alert('登录成功!');那样,直接写一个js的函数

效果如下:

Simulator Screen Shot 2016年9月26日 上午8.28.38.png

三、参考文章

Last modification:January 1st, 1970 at 08:00 am
如果看了这个文章可以让你少加会班,可以请我喝杯可乐
已打赏名单
微信公众号

11 comments

  1. sssss

    你好,我使用这个方法,调用到mui的方法后,我之后的操作是想使用mui.openWindow跳转其他页面,但是无法实现!请问怎么回事啊?

    1. 东东
      @sssss

      如果调用到了就需要查看下是不是函数调用有限制之类的,mui我大概一年多没用过了,具体的我也不太清楚,推荐去官方搜索下有没有类似的案例

  2. quanjf

    你的DEMO还有吗,方便的话发给我,我看看能不能找到问题。邮箱[email protected]

    1. 东东
      @quanjf
      var s = plus.ios.importClass("testDemo");

      里面也是类名,其他的好像没有什么改的,这个是一年前写程序的时候用了顺便写了demo,现在还真没有了

      1. quanjf
        @东东

        我还没有试过离线打包,这个是不是需要离线打包?

  3. quanjf

    嗯,基本上复制了你的代码,只是类名换成了TestDemo.是不是配置上需要做什么或者打包的时候要注意什么

  4. quanjf

    你好,我按照你写的js调oc试了一下,不行啊,会报错,[ERROR] : TypeError: null is not an object (evaluating 'TestDemo.Instantce')
    是还有什么其他操作需要注意吗?

    1. 东东
      @quanjf

      这个报错很明显的就是说的你传过来的是一个空值,不是一个对象啊,检查下你的传值

      1. quanjf
        @东东

        不是的吧,var hello = TestDemo.Instantce().helloword();是这一句报错的,这个错误是说TestDemo是null,不是一个对象,所以不能像调用对象的方法一样,调用Instance方法

        1. 东东
          @quanjf

          Instantce这个类的函数定义了吗?

          1. quanjf
            @东东

            嗯,基本上复制了你的代码,只是类名换成了TestDemo.是不是配置上需要做什么或者打包的时候要注意什么

Leave a Comment