updated July 05, 202444 views

Bạn có thể sử dụng một hook cụ thể để tải một tập tin JavaScript vào trong một component React. Hook này sẽ sử dụng để chèn một tập tin JavaScript vào trong một thẻ script, và gọi hàm JavaScript để thực hiện một hành động.

import { useEffect } from 'react'

export const useInjectScript = (src: string) =>
  useEffect(() => {
    // @ts-ignore
    if (window.__custom_injected__) return
    // @ts-ignore
    window.__custom_injected__ = true

    const script = document.createElement('script')
    script.src = src
    script.defer = true

    const onScriptError = () => script.remove()
    script.addEventListener('error', onScriptError)

    document.body.appendChild(script)
  }, [])
import { useInjectScript } from 'components/useInjectScript'

const Component = () => {
  useInjectScript('https://phannhatchanh.com/xxx/lib.js')

  return (
    <>
      <h1>Hello World</h1>
    </>
  )
}