Blaze 更改

提示

需要注意的是，将您的前端代码迁移到异步是不必要的。您仍然可以在客户端使用同步 MongoDB 方法，例如：Collection.fetch/Collection.findOne。

需要注意的是，将您的前端代码迁移到异步是不必要的。您仍然可以在客户端使用同步方法。

但为了维护同构代码，您可以在客户端使用异步方法。

自从这个 PR 与 Blaze 2.7 一起发布以来，Blaze 在其视图中支持异步。

您可以查看 Blaze 文档，以获取有关如何处理异步状态的更多信息。

@radekmie 发布了两篇关于使 Blaze 异步的优秀文章。这两篇都值得一读

• 关于 Blaze 中的异步性;
• 关于 Blaze 中的异步性（再次）;

在下面，您可以查看一些关于如何在 Blaze 中使用异步的示例，此 API 的文档 在此处

带有状态的简单示例

profile.html

{{#let name=getNameAsynchronously}}
  {{#if @pending 'name'}}
    We are fetching your name...
  {{/if}}
  {{#if @rejected 'name'}}
    Sorry, an error occured!
  {{/if}}
  {{#if @resolved 'name'}}
    Hi, {{name}}!
  {{/if}}
{{/let}}

profile.js

Template.profile.helpers({
  getNameAsynchronously() {
    return Meteor.callAsync("getName");
  }
});

带有异步列表的示例

您可以使用 let 在加载和迭代列表时处理异步状态

user_list.html

{{#let users=getUsersAsync}}
  {{#if @pending 'users'}}
    We are fetching your list...
  {{/if}}
  {{#if @rejected 'users'}}
    Sorry, an error occured!
  {{/if}}
  {{if @resolved 'users'}}
    {{#each user in users}}
      Hi {{user.name}}!
    {{/each}}
  {{/if}}
{{/let}}

user_list.js

Template.user_list.helpers({
  getUsersAsync() {
    return Meteor.callAsync("getUsers"); // returns a Promise<Array>
  }
});

如果您只想迭代并且没有内容要显示，则可以使用 else

profile.html

{{#each user in getUsersAsync}}
  {{user}}.
{{else}}
  Pending, rejected, or resolved and empty.
{{/if}}

profile.js

Template.profile.helpers({
  getUsersAsync() {
    return Meteor.callAsync("getUsers"); // returns a Promise<Array>
  }
});

带有异步 if 和 unless 的示例

对于处理假值或真值，您可以使用 if 和 unless，请注意，在解析 Promise 之前它不会呈现任何内容

profile.html

{{#if isOkAsync}}
  Resolved and truthy.
{{else}}
  Resolved and falsy.
{{/if}}

profile.js

Template.profile.helpers({
  isOkAsync() {
    return Meteor.callAsync("condition"); // returns a Promise<Boolean>
  }
});

unless 也是如此

profile.html

{{#unless isOkAsync}}
  Resolved and falsy.
{{else}}
  Resolved and truthy.
{{/unless}}

profile.js

Template.profile.helpers({
  isOkAsync() {
    return Meteor.callAsync("condition"); // returns a Promise<Boolean>
  }
});