移动端项目中一键复制记录

245 阅读1分钟
// 引入第三方库
import Clipboard from 'clipboard';
// 初始化
const btnCopy = new Clipboard('.copy');

// 结构
<input className='code' id="invitation-code" value='asf_28394_xcxue2349' onChange={change}/>
<div className='copy' data-clipboard-target="#invitation-code">复制</div>
// target要和input的id保持一致,input不能设置disable,否则不能复制

  // 复制成功  
btnCopy.on('success', (e: any) => {
    e.clearSelection(); // 清除选中内容
    // setShow(showToast.displayBlock);
    // setShow(showToast.displayNone);
    Tips.show({
      iconMode: iconMode.success,
      text: '复制成功',
    });
  });
  // 复制失败
  btnCopy.on('error', (e: any) => {
    Tips.show({
      iconMode: iconMode.error,
      text: '复制失败',
    });
    btnCopy.destroy();
  });