import React, { Component } from 'react';
import 'regenerator-runtime/runtime';
import Events from '@ali/ice-events';
import Loading from '../../components/Loading';
window.editors = [];
@Events
export default class MonacoEditor extends Component {
static displayName = 'MonacoEditor';
static propTypes = {};
static defaultProps = {
code: '',
type: 'jsx',
};
constructor(props) {
super(props);
this.state = {
monacoReady: false,
};
this.uniqueId = props.type;
}
shouldComponentUpdate(nextProps, nextState) {
if (this.state.monacoReady !== nextState.monacoReady) {
return true;
}
if (nextProps.code !== this.props.code) {
// this.editor.setValue(nextProps.code);
}
return false;
}
onChange = (newValue) => {
clearTimeout(this.timer);
this.timer = setTimeout(() => {
const { type } = this.props;
this.emit('editor:onChange', { type, code: newValue });
}, 1e3);
};
getIframeContent = (code) => {
const { type } = this.props;
const uniqueId = this.uniqueId;
window['_monacoReady' + uniqueId] = (editor) => {
this.editor = editor;
window.editors.push({
id: this.uniqueId, editor, type,
});
this.setState({ monacoReady: true });
};
window['_monacoChange' + uniqueId] = (str, evt) => {
// debounce 在下面这个函数做
this.onChange(str, evt);
};
return `
`;
};
render() {
const { monacoReady } = this.state;
const { code } = this.props;
return (