h5与原生app交互的方法

<template>

</template>

<script>
export default {
    data() {
        return {}
    },

    created(){
        /**
         * 安桌调用web端onFunction方法
         * @param str
         * @returns {string}
         */
        window.onFunction = function (str) {
            alert(str)
            return '这是onFunction方法的返回值'
        }

        /**
         * ios回调web的方法
         * @param str
         * @returns {string}
         */
        window.onFunctionIOS = function(str){
            alert(str)
            return 'onFunctionIOS执行完成'
        }
    },

    methods: {
        /**
         * 将数据传给安桌端
         */
        webSendAndroid() {
            window.AndroidJSBridge.androidTestFunction1('调用安桌里的方法将web端将有参数传入')
        },

        /**
         * 获取安桌端的返回值
         */
        getAndroidSendWeb() {
            let result = window.AndroidJSBridge.androidTestFunction2()
            alert(result)
        },

        /**
         * 将数据传给ios
         */
        webSendIos(){
            let obj = {
                'msg':'web端传的参数'
            }
            window.webkit.messageHandlers.iosTestFunction1.postMessage(obj)
        },


        /**
         * 获了ios返回的数据
         */
        getIosSendWeb(){
            window.webkit.messageHandlers.iosTestFunction2.postMessage({})
        },



        //web与原生交互
        //判断当前的项目标是运行在Android设备还是ios
        init(){
            if(window.androidJSBridge){

            }else if(window.webkit){

            }
        },

        /**
         * 调用android注册接口
         */
        onRegisterToAndroid(){
            //json字符串
            let userJson = JSON.stringify({
                'userName':this.userName,
                'password':this.password
            })
            //调用android注册方法,接收他的返回值
            let result = window.androidJSBridge.register(userJson)
            //对返回值进行处理
            this.onRegisterCallback(result)
        },

        /**
         * 调用IOS注册接口
         */
        onRegisterToIos(){
            //ios可以直接接收对象类型的数据
            let userObj = {
                'userName':this.userName,
                'password':this.password
            }

            /**
             * ios不能直接返回返回值,所以ios操作完成之后会回调地应的回调方法.
             * 同时原生调用js的方法只能使调用绑定到window对象中的方法
             * 所以我们需要把ios操作完成之后的回调方法(registerCallback)绑定到window对象中
             */
            window.registerCallback = this.onRegisterCallback;

            //调用ios注册方法
            window.webkit.messageHandlers.iosTestFunction1.postMessage(userObj)
        },

        /**
         * 用来处理Native注册接口的近回值
         */
        onRegisterCallback(result){

            if(result){
                alert('注册成功');
            }else{
                alert('注册失败,请重试')

            }
        }，
		
		
		/**
       * 将数据传给安桌端
       */
      webSendAndroid() {
        window.AndroidJSBridge.androidGetWebData('调用安桌里的方法将web端将有参数传入')
      },

      /**
       * 获取安桌端的返回值
       */
      getAndroidSendWeb() {
        let result = window.AndroidJSBridge.webGetAndroidData()
        alert(result)
      },

      /**
       * 将数据传给ios
       */
      webSendIos(){
        let obj = {
          'msg':'web端传的参数'
        }
        window.webkit.messageHandlers.iosGetWebData.postMessage(obj)
      },


      /**
       * 获了ios返回的数据
       */
      getIosSendWeb(){
        window.webkit.messageHandlers.webGetIosData.postMessage({})
      },



    }
}

</script>

<style>

</style>