手记

ReactJS集成openinstall

React作为前端流行框架之一,目前使用人数越来越多,与openinstall提供的第三方SDK相结合即可简单实现网页拉起应用并传递参数的场景。以下是在react组件中进行openinstall的web集成。

 

//在线加载JS
<scripttype="text/javascript"charset="UTF-8"src="//web.cdn.openinstall.io/openinstall.js"></script>


<script type="text/babel">
var data = OpenInstall.parseUrlParams();//解析链接后面拼接参数


class Test extends React.Component{
  constructor(props){
  super(props);
  this.handleChange=this.handleChange.bind(this);
  }


componentDidMount(){
  //初始化相关
  window.op = new OpenInstall({
  channelCode: 'xxx',//渠道编号,可自定义写在网页中
  appKey: 'xxxxxx,//填写由系统分配的appkey
  apkFileName : 'xxx.apk',//填写下载时安装包名称
  
  //自定义遮罩相关
  /*mask:function(){
    return 
    "<div id='openinstall_shadow'>...</div>"
    },*/
    
  },data);


  op.schemeWakeup();
  }


handleChange(event){
  op.wakeupOrInstall();//点击触发,若应用存在则拉起,若应用不存在则下载
  }


render(){
  return <div>
         <button onClick={this.handleChange}>Open App</button>
         </div>;
  }
}


ReactDOM.render(
  <Test />,
  document.getElementById('root')
  );
</scr

 

假定网页链接为www.xxx.com?channelCode=001&usrName=abc,网页和客户端集成后便可实现网页拉起应用并传递参数:


0人推荐
随时随地看视频
慕课网APP