代码之家  ›  专栏  ›  技术社区  ›  Sam

当使用盖茨比链接导航时,易趣上的Ins小部件不会显示,但会显示常规标签

  •  0
  • Sam  · 技术社区  · 4 年前

    我有一个ebay广告小部件,最初导航到它所在的页面时不会显示。我使用盖茨比的链接组件创建的链接导航到页面。( import {Link} from 'gatsby' )

    jsx看起来像。

    <ins class="h-100 w-100 epn-placement" data-config-id="999999999999"></ins>
    

    我必须把这个脚本广告到我的头上,才能让小部件显示出来。

    <script async src="https://epnt.ebay.com/static/epn-smart-tools.js"></script>
    

    (删除async无效)


    当我刷新页面或直接访问页面而不导航到页面时,组件会加载。

    如果我使用常规方法,这个问题不会发生 a 而不是 Link

    0 回复  |  直到 4 年前
        1
  •  1
  •   Ferran Buireu    4 年前

    自从 <Link> (继承自 @reach/router )不像典型的锚一样加载整个页面( <a> )是的,你可能想用 <链接> 的状态,以保留所有功能并添加eBay小部件的加载。

    在你的 <链接> 页面将是:

    <Link to={`/your-ebay-page` state={{ loadWidget: true }}> To Ebay Widget Page </Link>
    

    在您的易趣页面:

    const EbayPage = ({ location }) => {
      if (location.state.loadWidget) {
        return <ins class="h-100 w-100 epn-placement" data-config-id="999999999999"></ins>
    
      } else {
        // whatever
      }
    }
    

    由于缺乏代码和项目结构,这只是一种解决问题的方法或变通方法,您应该根据自己的规范进行调整。