常见的几种方式

1. copy（可用）

参考链接： github.com/sudodoki/co…

import copy from 'copy-to-clipboard';

copy('Text');

// Copy with options
copy('Text', {
  debug: true,
  message: 'Press #{key} to copy',
});

2. 基于Ant-Design React库里面就有相应的复制到剪切板。

参考链接： github.com/nkbt/react-…

NPM

npm install --save react-copy-to-clipboard

代码示例：

import React from 'react';
import ReactDOM from 'react-dom';
import {CopyToClipboard} from 'react-copy-to-clipboard';

class App extends React.Component {
  state = {
    value: '',
    copied: false,
  };

  render() {
    return (
      <div>
        <input value={this.state.value}
          onChange={({target: {value}}) => this.setState({value, copied: false})} />

        <CopyToClipboard text={this.state.value}
          onCopy={() => this.setState({copied: true})}>
          <span>Copy to clipboard with span</span>
        </CopyToClipboard>

        <CopyToClipboard text={this.state.value}
          onCopy={() => this.setState({copied: true})}>
          <button>Copy to clipboard with button</button>
        </CopyToClipboard>

        {this.state.copied ? <span style={{color: 'red'}}>Copied.</span> : null}
      </div>
    );
  }
}

const appRoot = document.createElement('div');
document.body.appendChild(appRoot);
ReactDOM.render(<App />, appRoot);

3. 剪切板操作navigator.clipboard的使用 ：

参考链接：juejin.cn/post/700743…

浏览器允许 JavaScript 脚本读写剪贴板，自动复制或粘贴内容，而这一切都是通过 navigator clipboard 的API来实现的。剪贴板可以用于存储数据并在应用程序内部或应用程序之间使用的临时空间。这些操作的 API 都是异步操作并返回一个 promise。

• navigator.clipboard.writeText：用于将文本内容写入剪贴板（浏览器Chrome、Firefox 和 Safari支持(这种写法不兼容windows系统，Mac可用)）

代码示例：

1. async function writeDataToClipboard() { 
2. const result = await navigator.clipboard.writeText("Hello"); 
3. console.log(result); 
4. }

4. document.execCommand() （已弃用）

该方法允许运行命令来操纵可编辑内容区域的元素。该方法返回一个布尔值 ，如果是 false 则表示操作不被支持或未被启用。

参考链接：参考链接：developer.mozilla.org/zh-CN/docs/…

选中文本，然后调用document.execCommand('copy')，选中的文本就会复制进入剪贴板复制代码

       const text = document.querySelector('#text');
       text.select();
       document.execCommand('copy');