react单页应用与app原生通信的总结


import React,{Component} from 'react'
import {connect} from 'react-redux'
import NavBars from '@/coms/nav_bar'
import axios from 'axios'
import {Toast} from 'antd-mobile'
import Qs from 'qs'
//需要回调
function controllerCenterCallBack(type,cmd,params){
    if(navigator.userAgent.indexOf("Android")>0){//判断是安卓浏览器
        eval('javascript:QM_APP_WEBVIEW_ENGINE_'+type+'.'+cmd+'("'+params+'")');
    }
    if(navigator.userAgent.toLowerCase().indexOf('iphone')>0){
        eval('window.webkit.messageHandlers.'+cmd+'.postMessage("'+params+'")');
    }

}
//不需要回调
function controllerCenter(type,cmd){
    if(navigator.userAgent.indexOf("Android")>0){//判断是安卓浏览器
        eval('javascript:QM_APP_WEBVIEW_ENGINE_'+type+'.'+cmd+'()');
    }
    if(navigator.userAgent.toLowerCase().indexOf('iphone')>0){
        eval('window.webkit.messageHandlers.'+cmd+'.postMessage("")');
    }
}
function scan(params){
    controllerCenterCallBack('scan','scan_bar',params);
}
class Source extends Component{
  constructor(props){
    super(props)
    this.state={}
    // app扫一扫完成后调用js的方法并返回扫描后的信息
    window.getQcodeInfo = (res) =>this.callback(res)
  }
  // 发起扫一扫后获取app返回的二维码用户信息
  callback =(res)=>{
    const resultId = JSON.parse(JSON.stringify(res)).Result  // 拿到扫描后的
  }

  // 调用app端扫描二维码
  toApp = ()=> {
    scan("getQcodeInfo")
  }
  componentWillMount(){

  }
  componentDidMount(){

  }
  goBack=()=>this.props.history.go(-1)
  render(){
    return(
      <div className='outer law_check'>
        <div className='sao_btn' onClick={this.toApp}>
          <i className='iconfont icon-saoyisaoerweimasaomasaomiao1 sao_icon'></i>
          开始扫描
        </div>
      </div>
    )
  }
}
const mapStateToProps = ()=> ({

})
const mapDispatchToProps = () => ({
  sendQcodeINfo(){

  }
})
export default connect(mapStateToProps,mapDispatchToProps)(Source)

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值