警告！

Question

我有一个渲染了地图的视图，这个视图有一个全局变量map，并希望将此变量传递给另一个视图以渲染该地图中的制作者。有可能吗？

first_view

ev.views.Home = Backbone.View.extend({
    map: 'null',
    initialize: function(){
        this.template = _.template(ev.templateLoader.get('home'));
        this.render();
    },

    initMap: function(){

        ...
    },

    render: function(){
                this.$el.html(this.template);
                this.initMap();
                return this;
    }   
});

second_view

ev.views.Lista = Backbone.View.extend({

initialize: function(){
    this.template = _.template(ev.templateLoader.get('lista_eventos'));
    this.render();
},

render: function(){
    var that = this;
    var imagens = new ev.models.ImagemCollection();
    imagens.fetch({
        success: function(){
            that.$el.html(that.template({imagens: imagens.models}));
            var marcadores = imagens.models;
            setTimeout(function() {
            _.each(marcadores, function(marcador){

                console.log("aquiiiiii");
                var myLatlng = new google.maps.LatLng(marcador.get('latitude'),marcador.get('longitude'));
                var marker = new google.maps.Marker({
                    position: myLatlng,
                    map: this.map,
                });

            });
                }, 10000);
        }
    });

}

});

编辑：

将方法render ev.views.Lista合并到ev.views.Home的方法render，如下所示：

ev.views.Home = Backbone.View.extend({
        map: 'null',
        initialize: function(){
            this.template = _.template(ev.templateLoader.get('home'));
            this.render();
        },

        initMap: function(){

            ...
        },

        render: function(){
        var that = this;
        var imagens = new ev.models.ImagemCollection();
        imagens.fetch({
        success: function(){
            that.$el.html(that.template({imagens: imagens.models}));
            that.initMap();
            var marcadores = imagens.models;
            setTimeout(function() {
            _.each(marcadores, function(marcador){
               var myLatlng = new google.maps.LatLng(marcador.get('latitude'),marcador.get('longitude'));
                   var marker = new google.maps.Marker({
                       position: myLatlng,
                       map: that.map,
                });

            });
            }, 10000);
            return that;
        }
    });

}


    });

Answer 1

首先，我不明白你的意思是全球性的。在你的代码中，没有我能看到的全局变量。我认为你误用了这个词。

需要质疑设计。国家的责任可能有利于被置于不同的背景/等级中。即便如此，我还会回答一下我能想到的最简单的答案。将管理地图的视图传递给第二个视图的initialize方法并保存实例引用。

更改ev.views.Lista.initialize()方法以接受参数。然后保存参考。最后从渲染函数中引用mapView。

ev.views.Lista = Backbone.View.extend({
  initialize: function(mapView) {
    this.mapView = mapView;
    this.render();
  },

  render: function() {
    this.mapView.map; // Your map object you want.
  }
});

var myMapView   = new ev.views.Home();
var myListaView = new ev.views.Lista(myListaView);

警告！

通过这样做，您可以将视图紧密地耦合在一起。这是一种非常糟糕的代码味道，当您回来并尝试维护或扩展代码时，将来会引起心痛。尽量避免这种情况，永远不要寻求短期解决方案。如上所述，更好的答案是重新设计对其他对象的责任。也许有一个管理地图的MapManager，可以查询对感兴趣的地图对象的引用。

ev.MapManager = {
  maps: {},
  add: function(name, map) {
    this.maps[name] = map;
  },
  remove: function(name) {
    this.maps[name] = null;
  },
  get: function(name) {
    return this.maps[name];
  }
};

将全局变量传递给另一个视图主干

1 个答案:

警告！