Meteor笔记-CSDN博客

Meteor

Meteor应用的文件结构

在 /server文件夹中的代码只会在服务端运行
在 /client文件夹中的代码只会在客户端运行
其他代码则同时运行于服务端和客户端
/lib文件夹中的文件将被优先载入
所有以main.*命名的文件将在其他文件载入后载入
所有静态资源文件放在/public文件夹中

Blaze模版

定义一个模板

<template name="xx1"> //xx命名必须要唯一
 ...
</template>复制代码

引用一个模板

{{> xx1}}复制代码

相互嵌套

<template name="xx1"> //xx命名必须要唯一
 {{> xx2}}
</template>复制代码

条件

 {{#if true}}
    <p>真</p>
 {{else}}
    <p>假</p>
 {{/if}}复制代码

遍历

 {{#each arry}}
   <p>{{name}}---{{age}}</p>
 {{/each}}


arry:function () {
 return [{name:'11'},{age:22},{name:'11'},{age:22}]
}复制代码

上下文

模板动态数据业务逻辑helpers，有关一些动态数据的判断都写在helpers对象中

局部：仅仅在xxx模板中起作用

Template.xxx.helpers({
 ...
});复制代码

全局：任意模板中都可以调用该变量

Template.registerHelper('变量名',(a,b)=>{
  return a===b;
});

某模板内：
<input type="checkbox" checked={{变量名 select 'yes'}}>
Template.xxx.helpers({
  select:'yes'
});复制代码

事件绑定
模板内置了jQuery，也就是说平时我们在前台操作的dom，转在了后台写。

Template.xx.events({
  "click button":function(event,template){
      ...
  },
  "mouseenter #myid":function(event,template){
      ...
  }
});复制代码

模板的生命周期

Template.xxx.onCreated(function(){
  //模板的实例化完成，但是还看见，适合设置初始化的变量
  this.haha='123'; //设置初始化变量 ，想在helpers和events函数中获取到此变量使用Template.instance().haha;
});

Template.xxx.onRendered(function () {
  //dom已经在页面存在，用户可以看见了，需要用js操作dom就在此步进行操作
});

Template.xxx.onDestroyed(function () {
  //模板被销毁时候回调
});复制代码

MongoDB

meteor中使用的数据库是MongoDB。

collection介绍

在mongodb中，collection相当于关系型数据库的表，但并不需提前创建，更不需要预先定义字段。
db.collect1.save({username:’mayj’,mail:’test@abc.com’})#向collect1中插入一条记录，collection会在第一次插入记录的时候自动创建。
db.collect1.save({username:’name2’,mail:’name2@abc.com’,age:28})#插入一条新记录，相对上条记录这次有三个key，类似三个字段。
db.collect1.find();#列出collect1中的所有记录。

在Meteor中创建一个新的collection使用：MyCollection = new Mongo.Collection("my-collection");，为了让这个Collection（我叫做集合吧）能在服务器和客户端使用，写在判断客户端还是服务器端的外面。
写好之后修改之前的JS，helper中返回集合的数据：

Tasks = new Mongo.Collection("tasks");
if (Meteor.isClient) {
  // This code only runs on the client
  Template.body.helpers({
    tasks: function () {
      return Tasks.find({});
    }
  });
}复制代码

Meteor可以使用的数据库操作API

find,findOne,insert,update,upsert,remove,allow,deny

insecure包

模拟每个客户端对服务器上的数据库拥有完全读/写权限的效果,通常生产环境需要移除这个包meteor remove insecure
这时如果创建一个清单，会发现多出一个清单又瞬间回到原样了，控制台显示update failed: Access denied，这就是延迟补偿：客户端上使用预读和模式模拟技术，使它看起来与数据库的连接是零延迟的。
去掉了insecure包，需要修改代码

方法一

// server
Tasks.allow({
    update: function(userId,doc,fieldNames,modifier){
        return true;
    }
});复制代码

如果返回true,允许客户端执行update操作，false时拒绝，也可以使用collection.deny方法来拒绝客户端修改数据库的请求。只有在客户端试图修改数据时才会触发，而服务器端不受这个限制

方法二通过Meteor.methods和Meteor.call的组合来实现客户端修改数据

//server
Meteor.methods({
    insert:function(task){
      Tasks.insert(task);
    }
});

//client
Template.task.events({
    'click .add': function () {
      Meteor.call('insert',{name:'Lin',skill: 'JS'});
    }
});复制代码

autopublish包

使用autopublish包，Meteor会客户端Minimongo中的内容和服务器端的MongoDB同步（除了users集合部分的内容和索引）通常生产环境也需要移除这个包meter remove autopublish

这时候客户端和服务器端的数据库就不同步了,假如我们有多个集合，可以选择性地从服务器端发布，然后从客户端订阅

//server
Meteor.publish("task",function(){
    return Tasks.find();
});

//client
Meteor.subscribe("task");复制代码