我在我的应用程序中使用交易视图小部件,在HTML中,该小部件可以正常工作,但在JSX中,它无法正常工作。
我使用了react-iframe,但运气不好,这是我需要在react组件中显示的小部件
<!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container">
<div class="tradingview-widget-container__widget">
<script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-market-overview.js"
async>
{
"gridLineColor": "rgba(242, 243, 245, 1)",
"scaleFontColor": "rgba(131, 136, 141, 1)",
"title": "Stocks",
"tabs": [{
"symbols": [{
"s": "NYSE:JPM",
"d": "Jpmorgan Chase & Co"
},
{
"s": "NYSE:WFC",
"d": "Wells Fargo Co New"
},
{
"s": "NYSE:BAC",
"d": "Bank Amer Corp"
},
{
"s": "NYSE:HSBC",
"d": "Hsbc Hldgs Plc"
},
{
"s": "NYSE:C",
"d": "Citigroup Inc"
},
{
"s": "NYSE:MA",
"d": "Mastercard Incorporated"
}
],
"title": "Financial"
},
{
"symbols": [{
"s": "NASDAQ:AAPL",
"d": "Apple"
},
{
"s": "NASDAQ:GOOGL",
"d": "Google Inc"
},
{
"s": "NASDAQ:MSFT",
"d": "Microsoft Corp"
},
{
"s": "NASDAQ:FB",
"d": "Facebook Inc"
},
{
"s": "NYSE:ORCL",
"d": "Oracle Corp"
},
{
"s": "NASDAQ:INTC",
"d": "Intel Corp"
}
],
"title": "Technology"
},
{
"symbols": [{
"s": "NASDAQ:AMZN",
"d": "Amazon Com Inc"
},
{
"s": "NYSE:BABA",
"d": "Alibaba Group Hldg Ltd"
},
{
"s": "NYSE:T",
"d": "At&t Inc"
},
{
"s": "NYSE:WMT",
"d": "Wal-mart Stores Inc"
},
{
"s": "NYSE:CHL",
"d": "China Mobile Limited"
},
{
"s": "NYSE:V",
"d": "Visa Inc"
}
],
"title": "Services"
}
],
"plotLineColorFalling": "rgba(33, 150, 243, 1)",
"plotLineColorGrowing": "rgba(33, 150, 243, 1)",
"showChart": true,
"height": 660,
"locale": "en",
"symbolActiveColor": "rgba(225, 239, 249, 1)",
"belowLineFillColorFalling": "rgba(5, 122, 205, 0.12)",
"belowLineFillColorGrowing": "rgba(5, 122, 205, 0.12)",
"width": 400
}
</script>
</div>
</div>
<!-- TradingView Widget END -->
如果我在.html文件中运行此HTML,则该小部件可以正常工作,实际上script标签会呈现一个iframe,但是在响应中,我不知道如何在jsx中显示iframe