IT视界开始使用 Parse.js 创建博客：删除、注销和查看个人博客文章
原创
在上一届会议中，您重构了整个博客系统。现在一切都已清理干净，您已准备好加速进行一些新的冒险。在本次会议中，我们将围绕路由器做更多的事情，并向我们的博客系统添加三个功能：删除、注销和单个博客视图。
1。删除
在第 6 部分中，我们介绍了编辑功能。您很可能还想删除您的一篇博客文章。有两个地方可以放置此函数：将其添加到 BlogsAdminView 中，或者将其发送到 URL 并在 Router 中处理。
我将向您展示路由器的方式。它更常用，并且使代码更加结构化。
第 1 步：添加 URL 模式
像往常一样，我们先添加一个 URL 模式：
routes: {
'': 'index',
'admin': 'admin',
'login': 'login',
'add': 'add',
'edit/:id': 'edit',
'del/:id': 'del'
}
第 2 步：删除链接
然后，更新管理页面中的链接：
Delete
第 3 步：del 函数
现在，让我们向 Router 添加一个新的 del 函数来处理它。这非常简单：使用我们从 URL 传入的 id 找到博客文章，并将其销毁。
尝试挑战自己，在不阅读我的代码的情况下编写它。此时您应该已经很好地掌握了 Parse.js。
del: function(id) {
var query = new Parse.Query(Blog);
query.get(id).then(function(blog){
blog.destroy().then(function(blog){
alert('Deleted!');
})
});
}
请注意，您可以在此处使用 .then() 函数，而不是像我们之前那样传递对象：
query.get(id, {
success: function(blog) {
...
},
error: function(blog, error) {
...
}
});
这是在 Parse.js 中添加回调函数的简单方法，使您的代码更干净、更具可读性。请访问 Parse.com 查看有关 Promise 的完整文档。
让我们对其进行测试运行，并仔细检查数据库以查看它是否正常工作。
恭喜，它正在工作！
第 4 步：重定向回管理页面
如果你注意一下URL，你会发现，点击掉警告框后，URL仍然是/del/，而你刚刚删除的帖子仍然存在。我们希望在删除后将用户发送回管理页面，并且该页面应该刷新并反映他们刚刚所做的更改。
您可以通过重定向来实现所有这些：
del: function(id) {
var self = this,
query = new Parse.Query(Blog);
query.get(id).then(function(blog){
blog.destroy().then(function(blog){
self.navigate('admin', { trigger: true });
})
});
}
请注意，因为这次您从路由器内部调用 navigate，所以您可以将路由器存储为 self，然后调用 self.navigate()。
第 5 步：检查登录
最后，我们需要确保您是唯一可以删除您的博客帖子的人。让我们检查一下该功能的登录。这应该与 edit 函数相同。
del: function(id) {
if (!Parse.User.current()) {
this.navigate('#/login', { trigger: true });
} else {
...
}
}
2。注销
与删除一样，注销也可以由路由器处理。它还从添加 URL 模式开始：
routes: {
...
'logout': 'logout'
},
Parse.js 中的注销功能本身非常简单。只需调用 Parse.User.logOut() ，然后重定向到 /login 页面：
logout: function () {
Parse.User.logOut();
this.navigate('#/login', { trigger: true });
}
最后，让我们向 #admin-tpl 添加一个按钮：
Logout
如您所见，样式确实不是本教程的重点。您可以随意修复填充并根据需要设置样式。
3。单个博客视图
现在让我们继续开发一些新功能。
到目前为止，我们正在主页上显示整篇博客文章。虽然有些人确实喜欢这种风格，但大多数博客系统都支持预先提供片段摘要的想法，如果访问者点击文章，他们就可以在单独的页面上看到内容，周围可能还有一些评论区域。<>
我将在本次会议中引导您创建这个详细的单一博客视图，我们将在下一次会议中重点关注构建评论。
第 1 步：添加摘要列
首先，我们在博客表中添加一列作为摘要：
第 2 步：在 WriteBlogView 中包含摘要
现在，让我们将其添加到 Blog.update() 函数中。您可以更改该函数以获取包含标题、摘要和内容的数据对象，以避免记住变量的顺序。
update: function(data) {
// Only set ACL if the blog doesn't have it
...
this.set({
'title': data.title,
'summary': data.summary,
'content': data.content,
...
}).save(null, {
...
});
}
在#write-tpl中再添加一个
作者文章
- 3月12日植树节(3月12日植树节的来历和意义) 12小时前
- 江苏一公司发生燃爆(江苏一公司发生爆炸) 12小时前
- 美恢复对乌安全援助(美国援助乌克兰) 12小时前
- 30多国讨论向乌派兵 12小时前
- 焦虑可以是一件好事(焦虑是一件好事还是坏事) 12小时前
豫公网安备41012202000391号