在我的模板中,我调用服务器端方法以将项目添加到集合中.该集合显示在页面上.呈现新项目后,我想为用户集中精力.
这是触发服务器方法的助手.
'click .add-post-button': function(e) {
var userId = Template.parentData(0)._id;
Meteor.call('addPost', userId, function(error, result) {
Session.set('newPostId', result);
});
}
完成后,将显示新项目.我想为用户集中精力.以前,我尝试使用jQuery在上面的回调中执行此操作,但这没有用,因为在执行回调时尚未将其添加到DOM中.现在,我正在尝试使用渲染的回调:
Template.postsAdmin.rendered = function() {
var newPostId = Session.get('newPostId');
if (newPostId) {
var $newPostCell = $('#' + newPostId);
$newPostCell.find('.post').focus();
}
};
不幸的是,这似乎也不起作用.当新项目添加到视图时,此代码不会运行.
在将新项目添加到视图中后如何运行代码以使新项目聚焦?
解决方法:
您的原始代码确实很接近-您只需要将焦点逻辑放在反应性上下文中,这样它将在会话变量更改后再次运行.成功的最短途径是使用template autorun:
Template.postsAdmin.onRendered(function() {
this.autorun(function() {
var newPostId = Session.get('newPostId');
if (newPostId) {
var $newPostCell = $('#' + newPostId);
return $newPostCell.find('.post').focus();
}
});
});
但是,您可能会遇到的一个问题是,您将遇到一种竞争状况,即在自动运行触发后会添加新帖子.一个棘手的解决方案是在上面添加超时.一种改进的解决方案是将类似于原始代码的内容添加到新添加的post子模板的onRendered回调中:
Template.post.onRendered(function() {
var newPostId = Session.get('newPostId');
if (newPostId === this.data._id) {
// add code here to focus this template instance
}
});
标签:javascript,jquery,meteor 来源: https://codeday.me/bug/20191014/1912140.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。