如何在Firebase实时数据库中使用HTML onclick函数为链接““标记增加值< a>

zour9fqk  于 2023-05-23  发布在  其他
关注(0)|答案(1)|浏览(205)

我想从firebase realtime数据库中读取一个值,然后通过将其递增1来更新该值,然后在firebase realtime数据库中再次更新该值。
javascript函数附加到HTML标记。

<div>
     <a href="#" onclick="return LikeButton();">Link</a> <br><br>
</div>

在下图中,我想更新Clicks的值,每次单击标记内的链接时递增+1。

下面是完整的代码-clicks_count.html
我尝试先使用get()函数读取数据库,然后使用update()函数在读取值增加+1后更新数据。

function LikeButton() {
    const dbref = ref(db);

    get(child(dbref, "Blogs/001/")).then((snapshot)=>{
        if(snapshot.exists()){
            var val = snapshot.val().Clicks;
            update(ref(db, "Blogs/001"),{
                Clicks: Number(val) + 1,
            })
            .then(()=>{
                alert("data enter successful");
            })
            .catch((error)=>{
                alert("unsuccessful, error="+error);
            });
        }
        else{
            alert("No data found");
        }
    })
    .catch((error)=>{
        alert("unsuccessful, error="+error);
    });
}
h5qlskok

h5qlskok1#

我的猜测是,页面在有要写入数据库的更改之前就导航走了。这是因为a标记上的onclick处理程序不知道您正在执行的异步操作。
不返回LikeButton调用的结果(即undefined),而是立即返回一个硬编码的值false,以防止页面导航:

<a href="#" onclick="LikeButton(); return false">Link</a>

相关问题