如何使用 React 显示无法选择/复制的文本

Question

我注意到一些网站发布了没有人可以选择或复制的文本。如何在 React 中实现这一点？可能吗？有时我相信他们正在使用一些图像，但这可能是使用太多字节的解决方案。

Answer 1

您可以在不希望用户选择的元素上使用user-select: none;。

function App() {
  return <div style={{ userSelect: "none" }}>Unselectable text</div>;
}
ReactDOM.render(<App />, document.getElementById("root"));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="root"></div>