如何在 ReactJs 组件中添加亚马逊广告脚本



如何在 spacific place 的 react 组件中集成脚本,下面是用于显示添加的脚本,当我在w3schools上通过脚本时它有效

<div class="alignleft">
  <script type="text/javascript">
  amzn_assoc_ad_type = "banner";
    amzn_assoc_marketplace = "amazon";
    amzn_assoc_region = "US";
    amzn_assoc_placement = "assoc_banner_placement_default";
    amzn_assoc_campaigns = "kuft";
    amzn_assoc_banner_type = "category";
    amzn_assoc_p = "48";
    amzn_assoc_isresponsive = "false";
    amzn_assoc_banner_id = ID;
    amzn_assoc_width = "728";
    amzn_assoc_height = "90";
    amzn_assoc_tracking_id = "reater-20";
    amzn_assoc_linkid = amzn_assoc_linkid;
  </script>
  <script src="//z-na.amazon-adsystem.com/widgets/q?ServiceVersion=20070822&Operation=GetScript&ID=OneJS&WS=1"></script>
</div>

示例我喜欢做什么

var React = require('react');
var AmazoneAdd = React.createClass({
    render: function() {
        return (
            <div >
              functionality data goes here....
              ...
              <div className='advertisement'>
                Here want to display the addvertise....
              </div>
            </div>
        );
    }
});
module.exports = AmazoneAdd;

我已经解决了这样的问题,

var React = require('react');
var AmazoneAdd = React.createClass({
  amazoneScript: function() {
    return '<div class="alignleft"> <script type="text/javascript"> amzn_assoc_ad_type = "banner"; amzn_assoc_marketplace = "amazon"; amzn_assoc_region = "US"; amzn_assoc_placement = "assoc_banner_placement_default"; amzn_assoc_campaigns = "kuft"; amzn_assoc_banner_type = "category"; amzn_assoc_p = "48"; amzn_assoc_isresponsive = "false"; amzn_assoc_banner_id = ID; amzn_assoc_width = "728"; amzn_assoc_height = "90"; amzn_assoc_tracking_id = "reater-20"; amzn_assoc_linkid = "asoc_linked"; </script> <script src="//z-na.amazon-adsystem.com/widgets/q?ServiceVersion=20070822&Operation=GetScript&ID=OneJS&WS=1"></script> </div>'
  },
  render: function() {
    return (
      <div >
        functionality data goes here....
        ...
        <div className='advertisement'>
          <div dangerouslySetInnerHTML={{__html: this.amazoneScript()}}></div> 
        </div>
      </div>
    );
  }
});
module.exports = AmazoneAdd;

只需使用 iframe 选项,它就可以很好地工作。而且您不会永远留在亚马逊联盟

最新更新