JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://unpkg.com/[email protected]/dist/react.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/react-dom.min.js"></script>
<script src="https://unpkg.com/[email protected]/built/bundle.js"></script>
<div style="width: 100vw; height: 100vh" id='react-dom'></div>
CSS
html, body {
margin: 0;
padding: 0;
border: 1px solid #ddd;
}
Babel + JSX
// import GaeaEditor from 'gaea-editor'
class CustomComponent extends React.Component {
static defaultProps = {
title: 'default',
gaeaSetting: {
key: "custom-text",
name: "自定义组件",
editors: [
"展示",
{
field: "title",
label: "标题",
type: "string"
}
]
}
}
render() {
return <div>custom component: {this.props.title}</div>
}
}
ReactDOM.render(
<GaeaEditor componentClasses={[CustomComponent]} />
, document.getElementById('react-dom'))