How to call card methods from an Android client-Mobile Platform as a Service(mPaaS)-阿里云帮助中心

JS implementation

<template>
    <div class="root">
        <text class="message" :value="message" @click="onClick()"></text>
        <custom-widget ref="widget" class="custom" :value="message2" @on-WidgetToCube="clientToCube(param)">
        </custom-widget>
    </div>
</template>

<script>

    export default {
        data: {
            message : 'This is the card text. Click me to call the custom widget.',
            message2 : 'This is the value passed to the custom widget.'
        },
        beforeCreate() {
            this.message = 'This is the card text. Click me to call the custom widget.'
            this.message2 = 'This is the value passed to the custom widget.'
        },
        didAppear() {
            
        },        
        methods: {
            onClick() {
                console.info('invoke on-click event');
                this.$refs.widget.cubeToWidget({
                    'auto':"This is the parameter sent to the custom widget method."
                },ret=>{
                    this.message = "Received callback from the custom widget method. Parameter: "+JSON.stringify(ret);
                });
            },
            // Native method to call a custom tag (call JS)
            clientToCube(param){
                console.info(param.p1)
                this.message2 = "Received event callback from the custom widget. Parameter: "+JSON.stringify(param)
            }
        }
    }
</script>

<style>
    .root {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background-color: white;
        width: 100%;
        height: 800rpx;
    }
    .custom {
        color: black;
        font-size: 20rpx;
        width: 100%;
        height: 600rpx;
    }
    .message {
        color: black;
        font-size: 20rpx;
        width: 100%;
        height: 200rpx;
    }
</style>

Call JS methods from a client

Android

Create a CubeCard instance mCard, then call the following method.

mCard.callJsFunction(String methodName, final CJSFunctionCallback callback, Object... params)

iOS

In the card loading delegate method, obtain the card instance, call the JS method, and pass the data.

#pragma mark---CrystalCardCallback
- (void)onLoaded:(CubeCard *)card cardType:(CCardType)cardType config:(CubeCardConfig *)config erroCode:(CubeCardResultCode)erroCode {
    if (!card) {
        NSString *errMsg = [NSString stringWithFormat:@"Creation failed: templteId=%@,style=%d, error=%d", [config templteId], cardType, erroCode];
        NSLog(@"Error message:%@", errMsg); 
        return;
    }
    
    NSLog(@"Creation successful succ %@ style %d error %d", [config templteId], cardType, erroCode);

    dispatch_async(dispatch_get_main_queue(), ^{        
        NSString *text = @"Client calls card JS method to pass parameters: Hello World";
        if (![text isEqualToString:@""]) {
            NSArray *valueArray = @[text];
            // Call the card's JS method and pass the parameters.
            [card callJsFunction:@"clientToCube" arguments:valueArray];
        }
    });
}

HarmonyOS

Create a CubeCard instance instance, then call the following method.

instance.callJsFunction(functionName: string, params: Array<Object>)