how to use script tag in react js code example
Example 1: react insert script tag
useEffect(() => {
const script = document.createElement('script');
script.src = "https://use.typekit.net/foobar.js";
script.async = true;
document.body.appendChild(script);
return () => {
document.body.removeChild(script);
}
}, []);
Example 2: import a script to my react componetn
import React,{Component} from "react";
import ReactDOM from "react-dom";
import "./styles.css";
class App extends Component {
componentDidMount() {
const script = document.createElement("script"); script.async = true; script.src = "https://some-scripturl.js"; this.div.appendChild(script); }
render() {
return (
<div className="App" ref={el => (this.div = el)}> <h1>Hello react</h1>
{/* Script is inserted here */}
</div>
);
}
}
export default App;
Example 3: how to import js via script in react
import { useEffect } from 'react';
const useScript = url => {
useEffect(() => {
const script = document.createElement('script');
script.src = url;
script.async = true;
document.body.appendChild(script);
return () => {
document.body.removeChild(script);
}
}, [url]);
};
export default useScript;
Example 4: react script tag for html
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>