IE11'de `window.location.hash.includes` atıyor“ Object özelliği veya yöntemi desteklemiyor 'içerir' ”

URL'yi ?pencerede karma pop durumunu kontrol etmek için içerip içermediğini veya içerdiğini görmek için kontrol ediyorum . Diğer tüm tarayıcılarda sorun yoktur, sadece IE.

Bu şekilde yüklemeye çalıştığımda hata ayıklayıcı bana bu hatayı veriyor:

Nesne özelliği veya yöntemi desteklemiyor ' includes'

Sayfayı popstate üzerinden yüklediğimde hata almıyorum.

    $(document).ready(function(e) {
        if(window.location.hash) {
            var hash;
            if(window.location.hash.includes("?")) {
                alert('I have a ?');
                hash = window.location.hash.substring(window.location.hash.indexOf('#') + 0,window.location.hash.indexOf('?'));
            }else {
                hash = window.location.hash;
            };
            if (hash=="#DRS" || hash=="#DRP" || hash=="#DFFI" || hash=="#DCI" || hash=="#DCP" || hash=="#DRP" || hash=="#DRMA" || hash=="#EICS" || hash=="#ORG"){
                $(hash+'Content').addClass('pageOn').removeClass('pageOff');
            }else {
                $('#homeContent').addClass('pageOn').removeClass('pageOff');
            };
        } else {
            $('#homeContent').addClass('pageOn').removeClass('pageOff');
        }
        $(window).on('popstate', function() {
            var hash;
            if(window.location.hash.includes("?")) {
                hash = window.location.hash.substring(window.location.hash.indexOf('#') + 0,window.location.hash.indexOf('?'));
            }else {
                hash = window.location.hash;
            };
            if (hash=="#DRS" || hash=="#DRP" || hash=="#DFFI" || hash=="#DCI" || hash=="#DCP" || hash=="#DRP" || hash=="#DRMA" || hash=="#EICS" || hash=="#ORG"){
                $(this).navigate({target: $(hash+'Content')});
                if(window.location.hash.includes("?")) {
                }else{
                    location.href = location.href+'?';
                }
            }else {
                $(this).navigate({target: $('#homeContent')});
            };
        });
});

Göre MDN referansı sayfasında , includesInternet Explorer desteklenmez. En basit alternatif şu şekilde kullanmaktır indexOf:

if(window.location.hash.indexOf("?") >= 0) {
    ...
}

IE11 String.prototype.includes uygular, bu yüzden neden resmi Polyfill kullanmıyorsunuz?

  if (!String.prototype.includes) {
    String.prototype.includes = function(search, start) {
      if (typeof start !== 'number') {
        start = 0;
      }

      if (start + search.length > this.length) {
        return false;
      } else {
        return this.indexOf(search, start) !== -1;
      }
    };
  }

Kaynak: çoklu dolgu kaynağı

Sorunumu import 'core-js/es7/array';benim polyfill.tsiçin ekledim.

Açısal bir projeyle benzer bir sorunum vardı. Benim polyfills.ts benim her ikisini de eklemek zorunda kaldı:

    import "core-js/es7/array";
    import "core-js/es7/object";

Diğer tüm IE 11 varsayılanlarını etkinleştirmeye ek olarak. (Açısal kullanıyorsanız polyfills.ts dosyasındaki yorumlara bakın)

Bu içe aktarmaları ekledikten sonra hata ortadan kalktı ve Nesne verilerim istendiği gibi dolduruldu.

Internet Explorer'da olduğu gibi, javascript yöntemi "içerir" aşağıdaki gibi hataya neden olan desteklemiyor

dijit.form.FilteringSelect TypeError: Nesne özelliği veya 'içerir' yöntemini desteklemiyor

Bu yüzden JavaScript string yöntemini "include" yerine "indexOf" olarak aşağıdaki gibi değiştirdim

//str1 doesn't match str2 w.r.t index, so it will try to add object
var str1="acd", str2="b";
if(str1.indexOf(str2) == -1) 
{
  alert("add object");
}
else 
{
 alert("object not added");
}

Kullandığım includesdan Lodashhangi yerli gerçekten benzerdir.

ReactJs kullanıyorum ve import 'core-js/es6/string';başında index.jssorunumu çözmek için kullanılır .

Ayrıca import 'react-app-polyfill/ie11';IE11 React çalışan desteklemek için kullanıyorum.

tepki-Uygulama-polyfill

Bu pakette, çeşitli tarayıcılar için çoklu dolgular bulunur. Create React App projeleri tarafından kullanılan minimum gereksinimleri ve yaygın olarak kullanılan dil özelliklerini içerir.

https://github.com/facebook/create-react-app/blob/master/packages/react-app-polyfill/README.md

Bu soru ve cevapları beni kendi çözümüme götürdü (SO'nun yardımıyla), ancak bazıları yerel prototiplere müdahale etmemeniz gerektiğini söylüyor:

  // IE does not support .includes() so I'm making my own:
  String.prototype.doesInclude=function(needle){
    return this.substring(needle) != -1;
  }

Sonra sadece tüm değiştirilir .includes()ile .doesInclude()ve benim sorunum çözüldü.