React里用dangerouslySetInnerHTML怎么防XSS？

我在用 React 渲染后台返回的富文本内容，必须用 dangerouslySetInnerHTML，但担心用户输入里有恶意脚本。试过直接插入，结果页面真被注入了 alert，这咋办？

有没有轻量又靠谱的方案？比如能不能在塞进去之前先过滤一下标签？我看到有人用 DOMPurify，但不确定在 React 里怎么配合用。

比如我现在是这么写的：

const RichText = ({ content }) => (
  <div dangerouslySetInnerHTML={{ __html: content }} />
);

如果加上 DOMPurify，是不是改成这样就行？

import DOMPurify from 'dompurify';

const RichText = ({ content }) => {
  const cleanHTML = DOMPurify.sanitize(content);
  return <div dangerouslySetInnerHTML={{ __html: cleanHTML }} />;
};

这样真的能防住 XSS 吗？会不会有性能问题或者漏掉某些攻击方式？