Spezifische Reaction-Code nicht gerendert in IE11

Question

Ich habe eine kleine Komponente geschrieben, die richtig in Chrome und Firefox, aber nicht IE11 rendert. Der Haupteinstiegspunkt für die Anwendung hat IE Kompatibilität Satz bekommt:

doctype html 
html 
    head 
    meta(http-equiv='X-UA-Compatible', content='IE=edge') 
    title= title 
    link(rel='stylesheet', href='./stylesheets/eventinfo.css') 
body 
block content 

Mein compoment sieht wie folgt aus:

import React from 'react'; 
import { SettingsPane, SettingsPage, SettingsContent, SettingsMenu} from 'react-settings-pane'; 
import {Col, Form, FormGroup, FormControl, ControlLabel, HelpBlock, Button, Alert, Checkbox} from 'react-bootstrap' 
import { Creatable } from 'react-select'; 

const Settings = React.createClass({ 

    render: function() { 
     var data = this.props.data; 
     var envFilter = data["settings.notifications.environments"] || ""; 
     var isChecked = this.props.data['settings.notifications.receiveMailNotifications']; 

     const menu = [ 
      { 
       title: 'Email warnings', 
       url: '/settings/notifications' 
      } 
     ]; 

     // Save settings after close 
     let leavePaneHandler = (wasSaved, newSettings, oldSettings) => { 
      // "wasSaved" indicates wheather the pane was just closed or the save button was clicked. 

      if (wasSaved) { 
       var environmentsObject = newSettings["settings.notifications.environments"]; 
       var environments = environmentsObject.toString(); 
       var applications = newSettings["settings.notifications.applications"]; 

       this.props.onSubmit(newSettings); 

      } 
     }; 

     return (
      <SettingsPane items={menu} index="/settings/notifications" settings={data} 
          onChange={this.settingsChanged} onPaneLeave={leavePaneHandler}> 
       <SettingsMenu headline="Settings"/> 
       <SettingsContent header={true}> 
        <SettingsPage handler="/settings/notifications"> 
         <FormGroup> 
          <Col componentClass={ControlLabel} sm={2} /> 
          <Col sm={10}> 
           <label> 
           <input 
            type="checkbox" 
            checked={isChecked} 
            onChange={this.props.toggleMailNotification} 
            /> 
            Receive mail notification for these environments 
            </label> 
          </Col> 
         </FormGroup> 
         <FormGroup> 
          <Col componentClass={ControlLabel} sm={2}> 
           <div> 
            <label>Miljø/miljøklasse</label> 
           </div> 
          </Col> 
          <Col sm={10} className="dummy"> 
           <Creatable 
            name="settings.notifications.environments" 
            options={this.props.options} 
            value={envFilter} 
            onChange={this.props.handleEnvironmentsChange} 
            multi={true} 
            allowCreate={true} 
            tabSelectsValue={false} 
            className="settings-creatable" 
            placeholder="Enter environments" 
           /> 
          </Col> 
         </FormGroup> 
        </SettingsPage> 
       </SettingsContent> 
      </SettingsPane> 
     ) 
    } 
}); 


export default Settings; 

Wie soll ich gehen über genau identifizieren, was bewirkt, dass IE11 nicht diesen Code machen? Es gibt keinen Fehler in der Konsole. Jeder Rat wird geschätzt.

Answer 1

Danke für die Antworten. Ich habe den Code basierend auf React-Bootstrap-Komponenten neu geschrieben, anstatt diesen zu debuggen. Nächstes Mal werde ich die Debugging-Vorschläge im Kommentarbereich verwenden.