Front-end copy and paste function

1. Encapsulate the copy function

// 复制内容到剪贴板
export const copyToClip = (content: string, tipString = '复制成功') => {
    
    
  const input = document.createElement('input');
  input.setAttribute('value', content);
  document.body.appendChild(input);
  input.select();
  document.execCommand('copy');
  document.body.removeChild(input);
  message.success(tipString);
};

Import function use:

 onClick={
    
    () => {
    
    
            copyToClip("你要复制的内容");
         }}

2. Plug-in copy-to-clipboard

yarn add copy-to-clipboard

use:

import Copy from 'copy-to-clipboard';

<Button
	onClick={
    
    () => {
    
    
	Copy(pageConfig.link);
	message.success('复制成功');
}}
>
复制链接
</Button>

Guess you like

Origin blog.csdn.net/weixin_47541876/article/details/126056809
Recommended