javascript - 使用后退按钮或 Iron 路由后，Meteor 模板没有反应

Question

我有一个简单的模板，显示网站列表和详细信息页面，允许用户发布有关该网站的评论。由于某种原因，当单击浏览器中的后退按钮或 Iron 路由器链接到另一个页面然后再次返回时，评论的更新功能不再具有反应性。集合已更新，但未呈现到模板。控制台中不会抛出任何错误。

我怀疑我的助手有问题，但我是个十足的菜鸟，在学习了短期类(class)后，我花了 7 天或更长时间才理解 Meteor、mongo、react...

我的更新集合的代码:

Template.website_details_form.events({
    "submit .js-add-comment": function(event) {
        var post, theID;
        post = event.target.post.value;
        theID = this._id;
        console.log("the post:" +post);  
        console.log("this is the id: " +theID);

        if(Meteor.user()) {     
             var user = Meteor.user().username;
             if (post != ""){
                 Websites.update({_id: theID}, {$addToSet:{comments:{user:user, comment:post}}});
                 $('input#post').removeClass('error');
             } else{
                 $('input#post').addClass('error');   
             }
         } else {
             swal("Please sign in to post!", "Oops...", "error");
         }      
         event.preventDefault();
     }
});

我的助手们无疑是时髦的助手:

var details_ID;
var thecomments; 
Template.website_details.helpers({
    sites:function() {      
        if(details_ID === undefined) {
            return Websites.find(
                { title: 'Goldsmiths Computing Department' });
        } else {            
           return Websites.find({_id:details_ID});
        }                
     }
}); 

Template.website_details_item.helpers({
    comments:function() {
        if(thecomments === undefined) {
            var c = Websites.find({title: 'Goldsmiths Computing Department'}).fetch();
            return c[0].comments;
         } else {
            return thecomments;
         }
     }
});

Template.website_details_form.helpers({
    identify:function(){
    if(details_ID === undefined){
        return Websites.find({ 
            title: 'Goldsmiths Computing Department' });
        } else {            
            return Websites.find({_id:details_ID});
        }            
     }
});

我的路由器:

Router.route('/website_details', function () {
    this.render('navBar', {to: 'navbar' });    
    this.render('website_details', {to: 'main'});
});

我正在文档上使用单击函数来获取我在帮助程序中使用的变量的信息....this._id,

我确实看到了另一个问题，专门询问使用后退按钮和铁路由后的 react 性，但该线程在 github 页面终止，几乎没有交互，并解决了一个我没有的问题......据我所知...... .我是菜鸟...提前致谢。

Answer 1

查看code ，我发现:

1. 在 Template.website_details_form.events ，Websites 集合正在正确更新。

Websites.update({ // Saving to collection   _id : theID}, {   $addToSet : {      comments : {         user : user,          comment : post      }   }});

但是，在 Template.website_details_item.helpers ，评论数据是从 Session 读取的，而不是从 Websites 集合中读取的。

...comments: function(){    var post = Session.get('site'); // Reading from Session   return post.comments;},...

解决此问题的两个建议:

1. 从 helpers 访问数据时，直接从 Websites 集合中读取:

var site_data = Websites.findOne({   _id: someId});if(site_data) { // Check if comments_data is undefined   return site_data.comment;} else {   return null;}

更新Websites集合时，立即更新Session数据:

Websites.update({ // Saving to collection   _id : theID}, {   $addToSet : {      comments : {         user : user,          comment : post      }   }}, function(err, data) {      if(!err) {         var site_data = Session.get('site');         /* Modify site_data */         Session.set('site', site_data);      }});

我建议使用第一个选项，因为它可以避免在 Session 中存储大量数据，并且客户端 minimongo 集合已经存储了相同的数据。