![](/img/trans.png)
[英]Reactjs class components not rendered but functions are rendered in IE11
[英]Specific React code not rendered in IE11
我編寫了一個小組件,可以在Chrome和Firefox中正確顯示,但不能在IE11中顯示。 該應用程序的主要入口點已設置IE兼容性:
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
我的作曲看起來像這樣:
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;
我應該如何確定到底是什么導致IE11不呈現此代碼? 控制台中沒有錯誤。 任何建議將被認真考慮。
感謝您的回答。 我最終基於react-bootstrap組件重寫了代碼,而不是調試了這一部分。 下次,我將使用注釋部分中提供的調試建議。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.