Javascript React组件中的clipboard.js出错？

我正在尝试在React组件中使用clipboard.js，这会导致我的devserver开始失败，出现节点错误：

ReferenceError:未定义元素
反对。（/mnt/home/me/code/board/webapp/node_modules/matches selector/index.js:6:13）

我在

componentDidMount

中初始化了剪贴板，但仍然收到此错误。我实际上认为错误可能与我的导入有关，因为即使我没有实际初始化剪贴板（但包括导入），我也会得到错误。有人知道我可能做错了什么吗

相关代码（不包括样式）：

import React，{Component}来自'React'；
从“剪贴板”导入剪贴板；
导出默认类代码片段扩展组件{
建造师（道具）{
超级（道具）；
}
componentDidMount（）{
新建剪贴板（“.copyButton”{
目标：（）=>document.getElementById（'snippet'）
});
}
render（）{
报税表（
{'此文本将复制'}
);
}
}

我创建了一个小提琴来更新您的代码。建议集成

clipboardjs

和

React

，使用和

---

选中此处：

如果要进行服务器端渲染，则不能要求使用clipboard.js。这很烦人，但他们建议不要通过npm进行安装，而是像这样手动添加脚本：

<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.12/clipboard.min.js"></script>

---

谢谢你的小提琴！这是React更好的集成。不过，在导入剪贴板时，我仍然会遇到节点错误。我在react测试项目中进行了测试，结果成功了。尝试更新您的软件包（react，剪贴板）（

npm update clipboard

）和/或重新安装它（

npm uninstall clipboard&&npm install clipboard--save

）。用react试试同样的方法。您正在使用Web包吗？缺少“复制”消息（工具提示）。我想知道如果在React中使用，这是否是剪贴板js错误。我应该补充一点，您无法在服务器端加载库的原因是它会立即尝试访问

window.Element

，该元素在浏览器中呈现页面之前显然不存在。

<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.12/clipboard.min.js"></script>