GraphQLEditor使您更容易理解GrapHQL模式。通过连接可视块来创建模式。GraphQLEditor会将它们转换为代码。使用GraphQLEditor，您可以创建可视化图表而无需编写任何代码或以一种很好的方式呈现您的架构！ GraphQLEditor会将它们转换为代码。  

安装

npm i graphql-editor

使用

import * as react from 'react';
import { render } from 'react-dom';
import { Editor } from '../src/index';

class App extends React.Component<
  {},
  {
    editorVisible: boolean;
  }
> {
  state = {
    editorVisible: true
  };
  render() {
    return (
      <div
        style={{
          width: '100%',
          height: '100%',
          display: 'grid',
          gridTemplateColumns: this.state.editorVisible ? `auto 1fr` : '1fr',
          gridTemplateRows: '1fr'
        }}
      >
        <Editor editorVisible={this.state.editorVisible} />
      </div>
    );
  }
}

render(<App />, document.getElementById('root'));

链接: https://www.fly63.com/nav/2241