Question

我遇到了这段代码的麻烦，因为我不确定如何修复它。我已经在聊天中问过这个问题，但在得到答案之后无法弄清楚自己。我想使用StreetViewService getPanorama（）方法中的Google Maps javascript API中的方法从StreetViewService获取Panorama。该方法接收具有坐标和半径的文字，以及接收2个参数的回调函数：数据和状态。在该回调中，您检查服务是否返回一些街景视图图像，在这种情况下，您做一件事或另一件事。

似乎回调是异步执行的，或者是getPanorama方法，在幕后执行某种类型的ajax。

我正在粘贴下面的代码，但首先我解释了我的意图。我需要从我在自制库中的文字内部制作的一个方法返回，请求具有所请求坐标的有效图像，或者通过将变量设置为true或false，然后在结束时返回该值。但是，即使我在回调匿名函数中将变量设置为true，当变量返回时，它总是具有它的初始值而不会被更改。

这里的代码。不是一切，只是基本代码。然后我的意图是使用返回的布尔值来知道我是否必须切换一个活动的某个按钮，或者做某些事情或不做，取决于它是返回true还是false，更改一些样式等。如果你能以一种可以完成的方式改变我的代码，我将不胜感激。我被告知有关回调解决方案或将其包含在承诺中。但是我不知道怎么做。我在jquery中使用promisses但在vanilla javascript中没有使用。我想看看如何使用此代码制作回调解决方案。

//Library not show for shortenning the example.
streetView: { //This is inside a library
  valid_request: false,
  event_key: null,
  panorama: null,

  setStreetView: function(coords, element) {
    libMapa.streetView.valid_request = false; // Initialize the value again.

    let sv_service = new google.maps.StreetViewService();
    var latlng = coords;

    sv_service.getPanorama({ // This is a method from Google Map Javascript API.
      location: latlng,
      radius: 50
    }, function(data, status) {
      if (status === google.maps.StreetViewStatus.OK) {

        if (!libMapa.streetView.panorama) {
          libMapa.streetView.panorama = new google.maps.StreetViewPanorama(element);
          libMapa.streetView.panorama.setEnableCloseButton(true);
        }
        libMapa.streetView.panorama.setPano(null);
        libMapa.streetView.panorama.setPano(data.location.pano);
        libMapa.streetView.panorama.setVisible(true);

        libMapa.streetView.valid_request = true;

      } else {
        alert("No images for this place");
        // Otherwise variable stays as FALSE.
      }
    });
    return libMapa.streetView.valid_request;
  }
}

/****************************************/
//OUTSIDE THE LIBRARY IN INDEX.HTML

var sv_valid = libMapa.streetView.setStreetView(coords, div_mapa);
//sv_valid still shows false even if it should return true.
if (sv_valid) {
  // "pressed" is to control a button as if it was a switch by activatinc and deactivating it.
  pressed = false; // It always ends up being false even when it should return true.
  element.style.cursor = "default";
  libMapa.mapa.unByKey(libMapa.streetView.event_key);
}

Answer 1

在对getPanorama()（以及代理，setStreetView()）的AJAX调用完成后，使用回调来执行某些操作或修改某些变量。

修改setStreetView()以接受回调参数并将其传递给getPanorama()。

streetView {

    // streetView variables etc.

    setStreetView: function(coords, element, callback) {

        // get ready for the AJAX call etc.

        sv_service.getPanorama({
            // parameter object
        }, function(data, status){
            // The getPanorama() callback.
            // Do stuff with the data/status here,
            // then call the callback function that you passed in to setStreetView.
            // You can send data along (e.g. the result of the AJAX call) to the callback.
            callback(someResult);
        });
    }
}

// somewhere else, where you're calling streetView.setStreetView()
var someVar = "foo";
streetView.setStreetView(someCoords, someElement, function(eventualResult){
    someVar = eventualResult;
});

以下是一个小例子：https://jsfiddle.net/_jered/pgftxgf3/

我还强烈建议您对AJAX，异步JavaScript和回调进行一些研究。

从Google Maps的StreetViewService.getPanorama（{}，callback）方法更改外部变量

1 个答案: