Facebook评论插件只显示在重新加载页面reactjs

Question

我正在使用Facebook评论插件在我的react应用中，但当我使用<链接到 />我得重新装子弹浏览一两次，使其正常工作。这是我的代码

index . html

<div id="fb-root"></div>
<script async defer crossorigin="anonymous"
src="https://connect.facebook.net/vi_VN/sdk.js#xfbml=1&autoLogAppEvents=1&version=v9.0&appId=3638093886307743"
nonce="Owrtrtj1"></script>

js组件

export class FacebookComment extends Component {
constructor(props) {
super(props);
}
render() {
const location = window.location.href;
return (
<div>
<div
class={"fb-comments"}
data-href={location}
data-width="100%" data-numposts="1"></div>
</div>
)
}
}

Answer 1

这是我的代码，它为我工作!

export function FacebookComment(props) {
const { link, title } = props;
React.useEffect(() => {
if (window.FB) {
window.FB.XFBML.parse();
}
},[]);
return (
<div className="facebookComment">
<div className="title">{title}</div>
<div
className="fb-comments"
data-href={link}
data-width="100%"
data-numposts="5"
></div>
</div>
);
}