Mientras transfiero el mejor artículo de stock en mi sitio web de Jekyll a NextJS, no puedo entender cómo pasar la configuración del widget al componente Script incorporado, simplemente no muestra el widget. Aquí está el código:
import Script from 'next/script' export default function StockSnippet({Exchange, Ticker}) { return <> <Script src="https://s3.tradingview.com/external-embedding/embed-widget-mini-symbol-overview.js"> {{"symbol": `${Exchange}:${Ticker}`, "width": "100%", "height": "100%", "locale": "en", "dateRange": "12M", "colorTheme": "light", "trendLineColor": "rgba(41, 98, 255, 1)", "underLineColor": "rgba(41, 98, 255, 0.3)", "underLineBottomColor": "rgba(41, 98, 255, 0)", "isTransparent": false, "autosize": true, "largeChartUrl": ""}} </Script> </>Intente convertir sus datos en una cadena JSON llamando a JSON.stringify
export default function StockSnippet({ Exchange, Ticker }) { const wrapperStyle = { width: "100%", height: "100%" } return <> <div id="tradingview-wrapper" style={wrapperStyle}> <Script id="tradingview-widget" src="https://s3.tradingview.com/external-embedding/embed-widget-mini-symbol-overview.js" onLoad={() => { document.getElementById('tradingview-wrapper').appendChild(document.getElementById('tradingview-widget')); }}> {JSON.stringify({ "symbol": `${Ticker}:${Exchange}`, "width": "100%", "height": "100%", "locale": "en", "dateRange": "12M", "colorTheme": "light", "trendLineColor": "rgba(41, 98, 255, 1)", "underLineColor": "rgba(41, 98, 255, 0.3)", "underLineBottomColor": "rgba(41, 98, 255, 0)", "isTransparent": false, "autosize": true, "largeChartUrl": "", })} </Script> </div> </> }