将TradingView小部件插入到Next.js中。
P粉478188786
P粉478188786 2023-07-27 14:09:01
[React讨论组]

我正在尝试将TradingView小部件插入到我的Next.js项目中,但是它没有显示任何内容。我在这里做错了什么吗?

import React from 'react'
import { Helmet } from "react-helmet"

function EconomicCalendar() {
  return (
    <div>
      <div className="tradingview-widget-container">
        <div className="tradingview-widget-container__widget"></div>
        <div className="tradingview-widget-copyright">
          <a href="https://www.tradingview.com/" rel="noopener nofollow" target="_blank">
            <span className="blue-text">Track all markets on TradingView</span>
          </a>
        </div>
        <Helmet>
          <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-events.js" async>
          {`
            {
              "width": "100%",
              "height": "100%",
              "colorTheme": "dark",
              "isTransparent": false,
              "locale": "en",
              "importanceFilter": "-1,0,1",
              "currencyFilter": "AUD,USD,CAD,CNY,EUR,FRF,DEM,ITL,JPY,KRW,MYR,MXN,NZD,SGD,ZAR,ESP,CHF,TRL,GBP"
            }
          `}
          </script>
        </Helmet>
      </div>
    </div>
  )
}

export default EconomicCalendar

通常应该怎么做

P粉478188786
P粉478188786

全部回复(1)
P粉930448030

如果您使用的是Next.js,您不需要使用React Helmet将脚本标签插入到头部。Next.js有自己的Script来优化和管理第三方JavaScript。或者您可以通过添加内联脚本来编写内联JavaScript。

请参阅官方文档https://nextjs.org/docs/app/building-your-application/optimizing/scripts

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号