只运行一次metro.js代码

Running meteor.js code only once

本文关键字:一次 metro js 代码 运行      更新时间:2023-09-26

我想在Template.foo.rendered中运行代码一次。我集成了一个传单地图和一个定位控制插件。到目前为止,它运行得很好,但渲染的模板似乎经常重新运行。因此,我在地图上定位用户的标记每隔几秒钟就会重置一次。我只想初始化它一次。

  var map, mapInit;
  map = void 0;
  mapInit = function (element){
      map = L.mapbox.map(element, 'examples.map-20v6611k').setView(new L.LatLng(52.02312,13.02627), 11);
      L.control.locate({drawCircle: true, position: 'topright'}).addTo(map);
  }
  Template.map.rendered = function () {
    $(window).resize(function () {
      var h = $(window).height(); 
      $mc = $('#map');
      $mc.css('height', h);
    }).resize();
    if (!this.rendered) {
      mapInit('map');
      this.rendered = true;
    }
  }

您可能需要将映射的DOM元素保存到全局或应用程序变量(此处为Map),然后将它们重新插入DOM:

var Map;
...
var mapDomElement = $('#map');
if (Map.domElements) {
  mapDomElement.replaceWith(Map.domElements);
} else {
  Map.mapObject = L.mapbox.map(...) // instantiate map here
  Map.domElements = mapDomElement;
}

注意高度重新计算:你不需要这么做。使用CSS弹性框模型最大化地图高度:

<div style="display: flex; flex-flow: column; min-height: 100%">
  <div id="map" style="flex: 1"></div>
  <div>
    ... map controls here
  </div>
</div>

请参阅flex模型上的答案。"东西到此为止"div是您的地图。