【问题标题】:Is there a way in Meteor to immediately re-render?Meteor 有没有办法立即重新渲染?
【发布时间】:2013-11-06 22:41:36
【问题描述】:

我目前有一个按钮,按下时会打开一个文本框。我想这样做,以便在按下按钮时焦点自动在此文本框上。

我有以下 HTML 来呈现按钮和输入,并在按钮/输入之间切换

    {{#if modeIs 'edit' }}
    <input class="col-xs-9" placeholder="Enter your new task and press enter"  id="insertTask" type="text"/>
    {{else}}
    <button id="btnNewTask"  class="btn btn-success btn-lg" role="button">New Task</button>
    {{/if}}

检查模式的辅助函数。

Template.insertNewTask.helpers({
    modeIs: function (modeToCheck) {
        return Session.equals('mode', modeToCheck);

    }
});

这是我想在单击按钮以更改模式并专注于输入时使用的代码。

'click #btnNewTask': function (event, template) {
    Session.set('mode', 'edit');
    var input = $(template.find('#insertTask'));

    if(input){
        input.focus();
    }

},

更改“模式”的位起作用,当我单击它时,按钮会变为文本框。

我的问题是这个查询 $(template.find('#insertTask'));什么都不返回,因为虽然我设置了模式,但它还没有重新渲染 HTML,而且文本框实际上还不存在。

当我将模式设置为“编辑”时,有没有办法告诉 Meteor 在继续执行其余功能之前立即重新渲染 HTML?有没有更好的方法来构建我的代码,以便我可以引用在 Meteor 重新呈现 HTML 之前不存在的 HTML 组件?

【问题讨论】:

    标签: meteor


    【解决方案1】:

    使用rendered 钩子:

    Template.insertNewTask.rendered = function() {
      var $input = $("#insertTask");
      if (Session.equals('mode', 'edit')) $input.focus()
    }
    

    您可以在某处设置另一个标志,以指示何时要聚焦输入(例如,如果您在渲染编辑视图后不总是希望聚焦它,只需单击按钮即可)。

    【讨论】:

      猜你喜欢
      • 2016-08-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2020-07-31
      • 1970-01-01
      • 1970-01-01
      • 2016-03-31
      • 2020-11-05
      相关资源
      最近更新 更多