如何在react js中检查div是否有子级

Question

我正在构建一个博客，用户可以在其中发表评论，我将所有响应映射到父div中，但当没有评论时，我想向用户显示没有评论，为了做到这一点，我想知道父div是否有子级。我怎样才能做到这一点？

div

function Answer({ map }) {
const [test, settest] = useState(map);
const [div, setdiv] = useState([]);
useEffect(() => {
const el1 = document.querySelector('.forum_answer_main');
setdiv(el1);
}, []);
useEffect(() => {
if (div.hasChildNodes() == 0) {
console.log('empty');
} else {
console.log('not empty');
}
}, []);
return <div className='forum_answer_main'>{test}</div>;
}
export default Answer;

Answer 1

与其检查父级是否有子级，不如检查状态数据中是否有注释，并决定从中显示什么。所有的渲染决策都应该根据props或state中的数据做出，而不是从DOM中做出。