如何为谷歌地图的 add_async_defer 函数添加两个条件？

如何解决如何为谷歌地图的 add_async_defer 函数添加两个条件？

谷歌地图所需的 add_sync_defer 函数通常如下所示：

//For Google Maps API
    function add_async_defer($tag,$handle) {
    if('googlemaps' !== $handle) {
        return $tag;
    }
    return str_replace(' src','async="async" defer="defer" src',$tag);
}
add_filter('script_loader_tag','add_async_defer',10,2);

然而，我试图在我的 wordpress 网站上运行两个谷歌地图（两个不同的缩放级别，两个不同的页面），让它工作在后面很痛苦，但它工作......有时。我无法让它与包含两个条件的任何类型的条件语句一起使用，如下所示：

//For Google Maps API
function add_async_defer($tag,$handle) {
    if(('googlemaps1' !== $handle) || ('googlemaps2' !== $handle)) {
        return $tag;
    }
    return str_replace(' src',2);

这导致地图应该出现的空白区域。然后我尝试使用两个函数，每个地图一个，但这会导致很多时候出现空白或地图加载正常。类似于以下内容：

//For Google Maps API
function add_async_defer1($tag,$handle) {
    if('googlemaps1' !== $handle) {
        return $tag;
    }
    return str_replace(' src','add_async_defer1',2);

（与 add_async_defer2 相同）

关于为什么会发生这些事情的任何指示？我宁愿只有一个异步延迟函数，也只有一个传入参数的 initMap 函数，但我找不到一种方法来做到这一点，以便拥有两个不同的地图（initMap 由 googlemaps 字符串调用，没有据我所知，参数可以在那里传递，根据页面设置缩放听起来是可行的，但是如何将我的自定义主题选项页面上设置的缩放设置正确地导入到 initMap 函数中？）

解决方法

我通过在functions.php文件中添加if语句解决了我的问题-

if ( is_page('contact')) { wp_register_script('googlemaps1'...etc) }
if ( is_page('about')) { wp_register_script('googlemaps2'...etc) }

因此仅在所需的特定页面上加载 googlemaps 脚本，肯定存在冲突，因为它试图将两个地图 API 加载到每个页面。现在，控制台日志中的所有错误都已清除，并且每次刷新页面或清除缓存时都会加载地图。

我还在 wp_enqueue 行周围添加了 if 语句：

if ( is_page('contact')) {
        wp_enqueue_script('googlemaps1');
    }

    if ( is_page('about')) {
        wp_enqueue_script('googlemaps2');
    }

add_async_defer 函数中 if 语句中的两个条件现在按预期工作：

function add_async_defer($tag,$handle) {
    if(('googlemaps1' !== $handle) && ('googlemaps2' !== $handle)) {
        return $tag;
    }
    return str_replace(' src','async="async" defer="defer" src',$tag);
}
add_filter('script_loader_tag','add_async_defer',10,2);

为了完整起见，以下是我在我的 scripts.js 中的地图内容：

//Google Map Init 1
var map1;

function initMap1() {

  var latlng = {
    lat: parseFloat( options.latitude ),lng: parseFloat( options.longitude )
  }

  map1 = new google.maps.Map(document.getElementById("map1"),{
    center: latlng,zoom: parseInt( options.zoom1 ),});

  var marker = new google.maps.Marker({
    position: latlng,map: map1,title: 'Here I am'
  });
}

//Google Map Init 2
var map2;

function initMap2() {

  var latlng = {
    lat: parseFloat( options.latitude ),lng: parseFloat( options.longitude )
  }

  map2 = new google.maps.Map(document.getElementById("map2"),zoom: parseInt( options.zoom2 ),map: map2,title: 'Here I am'
  });
}

我确定它不是最优的，我也许可以将它重构为一个带有变量的函数，但在此之前我知道这是可行的。