当前位置:K88软件开发文章中心编程语言JavaScriptMeteor → 文章内容

Meteor 评论

减小字体 增大字体 作者:佚名  来源:网上搜集  发布时间:2019-1-15 15:28:59

ors', {});});Template.commentSubmit.helpers({ errorMessage: function(field) { return Session.get('commentSubmitErrors')[field]; }, errorClass: function (field) { return !!Session.get('commentSubmitErrors')[field] ? 'has-error' : ''; }});Template.commentSubmit.events({ 'submit form': function(e, template) { e.preventDefault(); var $body = $(e.target).find('[name=body]'); var comment = { body: $body.val(), postId: template.data._id }; var errors = {}; if (! comment.body) { errors.body = "Please write some content"; return Session.set('commentSubmitErrors', errors); } Meteor.call('commentInsert', comment, function(error, commentId) { if (error){ throwError(error.reason); } else { $body.val(''); } }); }});类似以前 post 服务器端的 Meteor 方法,我们将建立一个 comment 的 Meteor 方法来创建评论,检查正确性后,插入到评论集合。Comments = new Mongo.Collection('comments');Meteor.methods({ commentInsert: function(commentAttributes) { check(this.userId, String); check(commentAttributes, { postId: String, body: String }); var user = Meteor.user(); var post = Posts.findOne(commentAttributes.postId); if (!post) throw new Meteor.Error('invalid-comment', 'You must comment on a post'); comment = _.extend(commentAttributes, { userId: user._id, author: user.username, submitted: new Date() }); return Comments.insert(comment); }});这里没做什么太花哨的,只是检查该用户是否已经登录,该评论有一个内容,并且链接到一个帖子。控制订阅评论如同以往一样,我们将发布属于所有帖子的全部评论到每个连接的客户端。这似乎有点浪费。毕竟在任何给定的时间段,实际上只使用该数据的一小部分。因此让我们提高发布和订阅评论的精度。如果仔细想想,我们需要订阅 comments 评论发布的时间,是当用户访问一个帖子的页面,而此刻只需要加载这个帖子的评论子集。第一步将改变我们订阅评论的方式。目前是路由器级订阅,这意味着当路由器初始化时,加载所有数据。但是现在希望我们的订阅依赖于路径参数,并且参数可以在任何时候改变。因此需要将我们的订阅代码从路由器级改到路径级。这样做的另一个后果:每当打开路径时加载数据,而不是初始化应用时加载它。这意味着你在程序内浏览时,会等待加载时间。除非你打算加载全部内容到客户端,这是一个不可避免的缺点。首先,在 configure 块中通过删除 Meteor.subscribe('comments'),停止预装全部评论(换句话说,要回以前的方法):Router.configure({ layoutTemplate: 'layout', loadingTemplate: 'loading', notFoundTemplate: 'notFound', waitOn: function() { return Meteor.subscribe('posts'); }});我们将为 postPage 添加一个新的路径级的 waitOn 函数://...Router.route('/posts/:_id', { name: 'postPage', waitOn: function() { return Meteor.subscribe('comments', this.params._id); }, data: function() { return Posts.findOne(this.params._id); }});//...我们将 this.params._id 作为参数传递给订阅。所以让我们用这个新信息来确保限制评论属于当前帖子:Meteor.publish('posts', function() { return Posts.find();});Meteor.publish('comments', function(postId) { check(postId, String); return Comments.find({postId: postId});});这里有一个问题:当我们返回主页,显示所有的帖子有0条评论:评论计数这个问题的原因是:我们只装载 postPage 路径上的评论,所以当我们调用 Comments.find({postId: this._id}) 中 commentsCount helper,Meteor 找不到必要的客户端数据为我们提供计数值。处理这一问题的最佳办法是非规范化的评论计数加到帖子中(如果你不明白这意味着什么,不用担心,接下来的附录会详解!)。正如我们将看到的,代码中复杂性稍微增加,但从不发布帖子列表的_全部_评论中,得到的执行性能改善是值得的。我们将通过在 post 数据结构中增加一个 commentsCount 属性来实现这一目标。首先,更新帖子的测试数据(用 meteor reset 去重载它们 —— 不要忘了之后重新创建你的帐户):// 测试数据if (Posts.find().count() === 0) { var now = new Date().getTime(); // create two users var tomId = Meteor.users.insert({ profile: { name: 'Tom Coleman' } }); var tom = Meteor.users.findOne(tomId); var sachaId = Meteor.users.insert({ profile: { name: 'Sacha Greif' } }); var sacha = Meteor.users.findOne(sachaId); var telescopeId = Posts.insert({ title: 'Introducing Telescope', userId: sacha._id, author: sacha.profile.name, url: 'http://sachagreif.com/introducing-telescope/', submitted: new Date(now - 7 * 3600 * 1000), commentsCount: 2 }); Comments.insert({ postId: telescopeId, userId: tom._id, author: tom.profile.name, submitted: new Date(now - 5 * 3600 * 1000), body: 'Interesting project Sacha, can I get involved?' }); Comments.insert({ postId: telescopeId, userId: sacha._id, author: sacha.profile.name, submitted: new Date(now - 3 * 3600 * 1000), body: 'You sure can Tom!' }); Posts.insert({ title: 'Meteor', userId: tom._id, author: tom.profile.name, url: 'http://meteor.com', submitted: new Date(now - 10 * 3600 * 1000), commentsCount: 0 }); Posts.insert({ title: 'The Meteor Book', userId: tom._id, author: tom.profile.name, url: 'http://themeteorbook.com', submitted: new Date(now - 12 * 3600 * 1000), commentsCount: 0 });}像往常一样,更新测试数据文件时,你必须用 meteor reset 重置数

上一页  [1] [2] [3]  下一页


Meteor 评论