0.1.0 • Published 4 years ago

chart-flow-edit v0.1.0

Weekly downloads
3
License
-
Repository
-
Last release
4 years ago

流程图引用(只显示流程图)

import { FlowChart } from 'flowEditor';

<FlowChart />

Props

属性类型是否必填默认值
dataObject
heightNumber400
fitViewStringtc

DEMO:

import React from 'react';
import './App.css';
import { FlowChart } from 'flowEditor';
const editData = require('./data.json');

class App extends React.Component {
  render() {
    const data = editData.modelJson
    return (
      <FlowChart data={data} fitView="tc" />
    );
  }
}

export default App;

data取值说明:

详见data.json里的modelJson字段

FlowEdit使用说明(可查看每个节点数据):

 import { FlowEdit } from 'flowEditor';

 <FlowEdit showProperty={true} showVariable={true} showAdvancedSettings={true} data={data} />

Props

属性类型是否必填默认值说明
showPropertyBooleantrue是否显示流程属性
showVariableBooleantrue是否显示流程变量
showAdvancedSettingsBooleantrue是否显示高级设置
dataObject数据格式见data.json完整数据

DEMO:

import React from 'react';
import { FlowEdit } from 'flowEditor';
import 'antd/dist/antd.css'
const editData = require('./data.json');

class App extends React.Component {
  render() {
    const data = editData
    return (
      <FlowEdit showProperty={true} showVariable={true} showAdvancedSettings={true} data={data} />
    );
  }

}

export default App;

TIPS:

FlowChart可嵌套在任意容器中,FlowEdit建议新开一个页面,只显示FlowEdit,且页面不要嵌套太多div等容器,最好只有FlowEdit