I am trying to load cricruns widget using the following script which has document.write
that will load the widget in the particular container where I have given. How can I achieve this inside render()
in ReactJS?
<script src="//www.cricruns.com/system/application/views/widgetBase/wid_300_200_1.js" type="text/javascript"></script>
Please check this fiddle for more on what I am trying to achieve.
Thanks in advance.
***Update: ok, I've played around with it a little bit. It works if you just bypass the document.write and add the iframe directly using dangerouslySetInnerHTML. I added a working codesandbox below and a code example.
I hope it helps!
https://codesandbox.io/s/z6k1w94z8m
import React from "react";
import { render } from "react-dom";
const App = () => {
return <div dangerouslySetInnerHTML={{__html: `
<iframe src="https://www.cricruns.com/widgetbase/wid_300_200_1"; width=250&colorscheme=light&show_faces=true&stream=false&header=true&height=320 " scrolling="yes" frameborder="0" style="border:none; overflow:hidden; width:310px; height:250px;" allowTransparency="true"></iframe>
`}} />;
};
render(<App />, document.getElementById("root"));
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.