我有一个dailog元素和一个函数，它得到所有的评论，并将它们添加到评论部分和一个输入按钮添加一个新的评论，但当我点击按钮，它递归地添加评论，除非我关闭浏览器Html

<dialog id="reply">
<div id="replymain">
<button id="replyclose">×</button>
<div id="coms">
<div id="com">hello there</div>
</div>
<div id="send">
<input id="sendinput" placeholder="Message"  />
<button id="sendreply">+</button>
</div>
</div>
</dialog>

用于添加所有注解

function comment(id){
localStorage.setItem("last",id)
reply.showModal()
firebase.database().ref("memes/" + id).once("value",(snap) => {
const cs = snap.val().comments || []
console.log(cs)
cs.forEach(c => {
coms.innerHTML += `
<div id="com">${c}</div>
`
})
})
}

按钮功能

sendreply.onclick = () => {
addC(localStorage.getItem("last") , sendinput.value , true)
}

AddC函数

function addC(id,c){
firebase.database().ref("memes/" + id).once("value",(snap) => {
const cs = snap.val().comments || []
firebase.database().ref("memes/" + id).update({
comments: [...cs,c]
})
})
}

有没有办法修复它，或者我必须用setTineout强制取消它