Meteor - Blaze模板

首页 / Meteor入门教程 / Meteor - Blaze模板

Blaze是用于构建实时反应模板的Meteor软件包。

渲染方法

此方法用于将模板呈现到DOM中,首先,无涯教程将创建要呈现的 myNewTemplate ,无涯教程还将添加 myContainer ,它将用作父元素,因此 render 方法知道在哪里渲染模板。

meteorApp.html

<head>
   <title>meteorApp</title>
</head>
 
<body>
   <div id = "myContainer">
   </div>
</body>

<template name = "myNewTemplate">
   <p>Text from my new template...</p>
</template>

接下来,无涯教程将创建一个带有两个参数的render函数。第一个是将要呈现的模板,第二个是无涯教程上面提到的父元素。

meteorApp.js

Meteor.startup(function () {

   if(Meteor.isClient) {
      var myNewTemplate = Template.myNewTemplate;
      var myContainer = document.getElementById('myContainer');
      Blaze.render(myNewTemplate, myContainer);
   }
});
Meteor Blaze Render

渲染数据

如果您需要被动地传递一些数据,可以使用 renderWithData 方法, HTML将与前面的示例完全相同。

meteorApp.html

<head>
   <title>meteorApp</title>
</head>
 
<body>
   <div id = "myContainer">
   </div>
</body>

<template name = "myNewTemplate">
   <p>Text from my new template...</p>
</template>

无涯教程可以在 Meteor.renderWithData 方法中将数据添加为第二个参数。其他两个参数与前面的示例相同。在此示例中,无涯教程的数据是记录一些文本的函数。

meteorApp.js

Meteor.startup(function () {

   if(Meteor.isClient) {
      var myNewTemplate = Template.myNewTemplate;
		
      var myData = function() {
         console.log('Log from the data object...')
      }

      var myContainer = document.getElementById('myContainer');
      Blaze.renderWithData(myNewTemplate, myData, myContainer);
   }
});
Meteor Blaze Render With Data

删除方法

无涯教程可以添加删除方法。

meteorApp.html

<head>
   <title>meteorApp</title>
</head>
 
<body>
   <div id = "myContainer">
   </div>
</body>

<template name = "myNewTemplate">
   <p>Text from my new template...</p>
</template>

在此示例中,无涯教程呈现了将在三秒钟后删除的模板,注意无涯教程用来删除模板的 Blaze.Remove 方法。

meteorApp.js

Meteor.startup(function () {

   if(Meteor.isClient) {
      var myNewTemplate = Template.myNewTemplate;
      var myContainer = document.getElementById('myContainer');
      var myRenderedTemplate = Blaze.render(myNewTemplate, myContainer);

      Meteor.setTimeout(function() {
         Blaze.remove(myRenderedTemplate);
      }, 3000);
   }
});

下表显示了可以使用的其他方法。

Sr.No.Method & Details
1

Blaze.getData([elementOrView])

用于从渲染元素中检索数据。

2

Blaze.toHTML(templateOrView)

用于将模板或视图呈现到字符串。

3

Blaze.toHTMLWithData(templateOrView,data)

用于将模板或视图呈现给包含其他数据的字符串。

4

new Blaze.View([name],renderFunction)

用于创建DOM的新Blaze反应部分。

5

Blaze.currentView

用于获取当前视图。

6

Blaze.getView([element])

用于获取当前视图。

7

Blaze.With(data,contentFunc)

用于构造一个使用context呈现某些内容的视图。

8

Blaze.If(conditionFunc,contentFunc,[elseFunc])

用于构造呈现某些条件内容的视图。

9

Blaze.Unless(conditionFunc,contentFunc,[elseFunc])

用于构造呈现某些条件内容的视图(倒置的 Blaze.if )。

10

Blaze.Each(argFunc,contentFunc,[elseFunc])

用于构造一个为每个项目呈现 contentFunct 的视图。

链接:https://www.learnfk.comhttps://www.learnfk.com/meteor/meteor-blaze.html

来源:LearnFk无涯教程网

11

new Blaze.Template([viewName],renderFunction)

用于构建具有名称和内容的新Blaze视图。

12

Blaze.isTemplate(value)

如果值是模板对象,则用于返回true。

这一章《Meteor - Blaze模板》你学到了什么?在下面做个笔记吧!做站不易,你的分享是对我们最大的支持,感谢!😊

好记忆不如烂笔头。留下你的足迹吧 :)

相关推荐

Spring Boot与Kubernetes云原生微服务实践 -〔杨波 - 〕

性能工程高手课 -〔庄振运 - 〕

Java业务开发常见错误100例 -〔朱晔 - 〕

Django快速开发实战 -〔吕召刚 - 〕

跨多个变量绘制特定值的计数

我可以动态导入 ES6 模块吗?

使用矩阵变量制作“整洁”的 tibble 数据集

Django 模型 Select - 只允许管理界面上的特定转换

如果 r 中的其他列中存在值,如何创建列标记?

实现蛇游戏:蛇接触食物,食物保持在同一位置