Die Verwendung von „window.location.hash.includes“ löst „Objekt unterstützt Eigenschaft oder Methode ‚includes‘“ in IE11 nicht aus

Ich überprüfe die URL, um zu sehen, ob sie eine enthält oder enthält ? darin, um den Hash-Pop-Status im Fenster zu steuern. Alle anderen Browser haben kein Problem, nur IE.

Der Debugger gibt mir diesen Fehler, wenn ich versuche, auf diese Weise zu laden:

Objekt unterstützt keine Eigenschaft oder Methode ‘includes‘

Ich erhalte keine Fehlermeldung, wenn ich die Seite über den Popstate lade.

    $(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')});
            };
        });
});

Laut dem MDN-Referenzseite, includes wird vom Internet Explorer nicht unterstützt. Die einfachste Alternative ist die Verwendung indexOfso was:

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

IE11 implementiert String.prototype.includes, warum also nicht das offizielle Polyfill verwenden?

  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;
      }
    };
  }

Quelle: Polyfill-Quelle

Hinzufügen import 'core-js/es7/array'; zu meinem polyfill.ts hat das Problem für mich behoben.

Ich hatte ein ähnliches Problem mit einem Angular-Projekt. In meinem polyfills.ts musste ich beides hinzufügen:

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

Zusätzlich zum Aktivieren aller anderen IE 11-Standardeinstellungen. (Siehe Kommentare in polyfills.ts bei Verwendung von eckig)

Nach dem Hinzufügen dieser Importe verschwand der Fehler und meine Objektdaten wurden wie beabsichtigt ausgefüllt.

Wie im Internet Explorer wird die Javascript-Methode „includes“ nicht unterstützt, was zu dem folgenden Fehler führt

dijit.form.FilteringSelect TypeError: Objekt unterstützt Eigenschaft oder Methode ‘includes’ nicht

Also habe ich die JavaScript-String-Methode wie unten beschrieben von „includes“ in „indexOf“ geändert

//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");
}

Ich habe verwendet includes aus Lodash was dem Eingeborenen sehr ähnlich ist.

Ich verwende ReactJs und verwendet import 'core-js/es6/string'; am Anfang von index.js um mein Problem zu lösen.

Ich benutze auch import 'react-app-polyfill/ie11'; zur Unterstützung der Ausführung von React in IE11.

reagieren-app-polyfill

Dieses Paket enthält Polyfills für verschiedene Browser. Es enthält Mindestanforderungen und häufig verwendete Sprachfunktionen, die von Create React App-Projekten verwendet werden.

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