Question

我正在创建类似reddit评论部分的内容，有人可以发表评论，人们可以回复该评论。

我正在使用Node，Express，MySQL，EJS。

问题：我不知道如何制作upvote / downvote部分，我不知道如何制作一个onclick事件，告诉我的DB在没有重新加载的情况下将该注释向上/向下注1页面。

快递代码：

app.get("/posts", function(req,res){
    connection.query(`SELECT post FROM testingposts`, function(error,result){
        if(error){
            console.log(`error 757`)
        } else {
            console.log(`works btw`)              
            res.render("posts", {result: result })

        }
    })
})



app.post("/posts", function(req,res){
    let post = req.body.post;
console.log(`req.body`)
console.log(req.body.theValue)

    connection.query(`INSERT INTO testingposts(post) VALUES(?)`, [req.body.post], function(error,result){
        if(error){
            console.log(`error 555`)
        } else {

            res.redirect("/posts")

        }
    })
})

EJS：

//This part basically creates the html elements for the comments. 
//But I haven't added the upvote/downvote elements yet.
<% for(let i = 0; i < result.length; i++){ %> 
      <div value="<%= i %>">
    <p><%= result[i].post %></p>
    <input id="<%= i %>" type="submit" value="reply" onclick=bob(event) >
    <input type="submit" value="report" >
      </div>


<form method="post" action="posts"  style="display:none">

<textarea name="replytextarea" id="" cols="30" rows="10"></textarea>
<input type="text" class="forValue" name="theValue" value="5" style="display: none">
<input type="submit" value="submit btw" onclick="setValue(event)">
</form>

<% } %>

我尝试使用Fetch尝试一些东西，但它对我来说没有正常工作。（我不知道该写什么作为URL）

Answer 1

冷却。所以关于表达的一个简洁的事情就是你可以制作你想要的任何端点，它可以做你想做的任何事情。那么让我们说你想提出一个赞成某个评论的AJAX请求？你可以创建它。

（这些是PUT路由，因为它们会更改有关已存在的记录的信息。）

router.put('/posts/upvote/:comment_id', (req, res) => {
  // something that increments the number of upvotes for that particular comment
  res.status(200).json({voteNum: // new vote number})
})

router.put('/posts/downvote/:comment_id, (req, res) => {
  // something that decrements the number of downvotes for that particular comment
  res.status(200).json({voteNum: // new vote number})
})

然后你可以使用它：

// when the upvote button is clicked
fetch(`/posts/upvote/${your_comment_id}`, { method: 'PUT', credentials: 'include' })
  .then(res => res.json())
  .then(jsonRes => {
    // get the element with the number of votes
    element.innerText = jsonRes.voteNum
  })

当然，这需要一些工作才能使其适合您的代码。但是，总的来说，如果你不确定要为URL写什么...只记得，你可以弥补。

EJS - 更新数据库中的数据，无需从EJS重新加载页面

1 个答案: