amis/examples/components/Editor.jsx

51 lines
1.7 KiB
JavaScript

import React from 'react';
import Editor from '../../src/editor/Editor';
import Switch from '../../src/components/Switch';
import Button from '../../src/components/Button';
import schema from './Form/Test';
import { Portal } from 'react-overlays';
export default class AMisSchemaEditor extends React.Component {
state = {
preview: localStorage.getItem('editting_preview') ? true : false,
schema: localStorage.getItem('editting_schema') ? JSON.parse(localStorage.getItem('editting_schema')) : schema
};
handleChange = (value) => {
localStorage.setItem('editting_schema', JSON.stringify(value));
this.setState({
schema: value
});
}
handlePreviewChange = (preview) => {
localStorage.setItem('editting_preview', preview ? 'true' : '');
this.setState({
preview: !!preview
});
}
clearCache = () => {
localStorage.removeItem('editting_schema');
this.setState({
schema: schema
});
}
render() {
return (
<div className="h-full">
<Portal container={() => document.querySelector('#headerBar')}>
<div className="inline m-l" >
预览 <Switch value={this.state.preview} onChange={this.handlePreviewChange} className="v-middle" inline />
<Button size="sm" className="m-l" onClick={this.clearCache}>清除缓存</Button>
</div>
</Portal>
<Editor preview={this.state.preview} value={this.state.schema} onChange={this.handleChange} className="fix-settings" />
</div>
);
}
}