一键复制功能（兼容pc端和移动端）2种方式以及附带案例

react-copy-to-clipboard

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

import React from 'react';
import {CopyToClipboard} from 'react-copy-to-clipboard';
 
const languageList =()  => [
    {
        title: 'English',
        address: 'https://www.gbc.team/en/',
    },
    {
        title: '中文',
        address: 'https://www.gbc.team/zh/',
    },
    {
        title: '日本語',
        address: 'https://www.gbc.team/ja/',
    },
    {
        title:"한국어",
        address:'https://www.gbc.team/kor/'
    }
]
class Clipboard extends React.Component { 
  render() {
    return (
      <div>
          {
              languageList().map((item,index)=>
                  <p key={index}>
                    <span>{item.title}</span>
                    <br />
                    <span>{item.address}</span>
                    <CopyToClipboard text={item.address}
                        onCopy={(value,message) => this.copys(value,message)}>
                        <button>copy</button>
                        </CopyToClipboard>
                  </p>
              )
          } 
      </div>
    );
  }
  copys=(value,message)=>{
      if(message){
        alert('复制成功，内容为:'+value)
      } 
  }
}
export default Clipboard

这款插件，访问量多，可能更稳定点儿吧！
下面介绍另外一款插件，以及使用方法

react-to-copy

npm install react-to-copy --save
or
yarn add react-to-copy

import React, { Component } from 'react' 
import { Copy } from 'react-to-copy'
 
class ButtonCopy extends Component {
    render() { 
        return (  
            <div>
               <Copy
                  content={'要复制的值'}
                 className={'类名'}
                 btnText={'复制按钮文字，默认为：Copy'}
                 callback={() => this.copycdes()}>//复制成功的回调函数，常用于复制成功提示
               </Copy> 
            </div> 
        )
    }
    copycdes = theme => {
        alert("复制成功")
    }
}
export default ButtonCopy

以上2种方法自己都试了，个人觉得都还可以，使用方法都很简单，第一种下载量大，使用者多，但是依赖度多，如果想要更轻量级多插件，第二种也是很不错多选择，自己试用了第二种，确实也没发现其他问题，多种移动端手机试了，都可以！