17.useCopyToClipboard

文章预览

在 Web 应用中， 复制文本到剪贴板 是一个常见但有时棘手的功能。它涉及 DOM 操作和浏览器 API，这在 React 的声明式编程模型中可能显得不太自然。 useCopyToClipboard 钩子提供了一种优雅的方式来封装这个功能，使其易于在 React 组件中使用。这个自定义钩子不仅简化了复制操作，还提供了复制状态的反馈。以下是如何实现和使用这个自定义钩子： const  useCopyToClipboard =  text  =>  {    const  copyToClipboard =  str  =>  {      const  el =  document .createElement( 'textarea' );     el.value = str;     el.setAttribute( 'readonly' ,  '' );     el.style.position =  'absolute' ;     el.style.left =  '-9999px' ;      document .body.appendChild(el);      const  selected =        document .getSelection().rangeCount >  0         ?  document .getSelection().getRangeAt( 0 )         :  false ;     el.selec ………………………………