Question

我是新手。我正在尝试建立一个用户可以关注/取消关注对方的网站。喜欢/不同于帖子。我正在使用Node js和MySQL。

我知道如何让用户使用表单添加新帖子，这会将他们引导到POST路由，我可以在那里做后端工作。但是，如何添加类似于Twitter / Instagram的跟随按钮，当用户点击它而不刷新页面时，该按钮会动态更改。

我在前端和＃34; Profile.ejs文件＆＃34;中想到了类似的东西。

Gold--:Exchange(id=2)-->MegaBoots--:Exchange(id=4)-->MegaHelmet

但是后来我无法传递我在后端尝试关注的用户的信息（例如user_id），并且无法将按钮值更改为＆＃34;取消关注＆＃34;。这就是我以为我会在后端做的事情：

<form action="/follow" method="POST">
  <input class="btn btn-primary a-btn-slide-text" name="follow" type="submit" value="Follow"/>
</form>

有关如何实现这一目标的任何想法？还有什么资源/网站/课程，我可以从如何使用nodejs这样的动态/ javascript东西中学习？

Answer 1

您应该在前端模板中使用Ajax向后端发送请求。

类似的东西（你不需要把它放在一个表格中）：

<button type="button" id="follow">Follow</button>

<script type="text/javascript">
$("#follow").click(function(){  
    $.ajax({
       url: '/follow',
       type: 'GET',
       dataType: 'json',
       success: function(data, status){ 
           // Here you can change your button text using jQuery
       }
    });
});
</script>

然后，在你的后端：

app.get("/follow", function(req, res) { 
    var follow = {follower_id:currentUser.id, followee_id:user_id};
    // Do stuff here, call your database, etc.
    res.send({ msg: "User followed/unfollowed!" });
});

您的Ajax方法将收到以下消息：{ msg: "User followed/unfollowed!" }

如何使用节点js添加follow / unfollow按钮

1 个答案: