Skip to main content

useScript() ↔ Custom Hook to Dynamically load external Script

export default function useScript() {
  const [status, setStatus] = useState(src ? "loading" : "idle")
  
  useEffect(() => {
    if(!src) { setStatus("idle"); return }
    
    let script = document.querySelector(`script[src="${src}"]`)
    
    if(!script) {
      script = document.createElement("script")
      script.src=src
      script.async = true
      script.setAttribute("data-status", "loading")
      
      document.body.appendChild(script)
      
      function setAttributeFromEvent(e) {
        },[])
}

References​