Javascript 创建新的div onClick in React

我需要每次而不是一次创建新的空div onClick，在react中这样做是否正确，我只是怀疑在react中这样做是否正确

import "./styles.css";

export default function App() {
  const parentRef = useRef();

  const createNewDiv = () => {
    parentRef.current.appendChild(document.createElement("div"));
  };

  return (
    <div className="App">
      <div onClick={createNewDiv} ref={parentRef}>
        clickHere
      </div>
    </div>
  );
}

导入“/styles.css”； 导出默认函数App（）{ const parentRef=useRef（）； const createNewDiv=（）=>{ parentRef.current.appendChild（document.createElement（“div”））； }; 返回( 点击这里 ); }

---

尝试使用reactcreateElement方法，而不是直接使用appendChild。 在数组中添加新元素，然后在JSX中显示此数组

import React，{useRef，useState}来自“React”；
导入“/style.css”；
导出默认函数App（）{
const parentRef=useRef（）；
const[elements，setelements]=useState（[]）；
const createNewDiv=（）=>{
//parentRef.current.appendChild（document.createElement（“div”））；
const newElement=React.createElement（'div'，{key:'ele'+new Date（）.getTime（）}，'Hello`，）；
setelements（elements=>[…elements，newElement]）；
};
返回(
你好，斯塔克布里兹！
开始编辑以查看发生的奇迹：）

点击这里
{
元素
}
);
}

必须将div绑定到某个数组，然后使用

.map

。这将是涉及和解的正确方式mechanism@Rostyslav谢谢，你能给我举个例子吗？