,

react-org-tree属性插件

使用 效果

https://github.com/artdong/react-org-tree

# use npm
npm i react-org-tree

# use yarn
yarn add react-org-tree

使用

import OrgTree from 'react-org-tree';

const horizontal = false; // true:横向  false:纵向
const collapsable = true; // true:可折叠 false:不可折叠 
const expandAll = true; // true: 全部展开 false:全部折叠 

const data = {
    id: 0,
    label: 'XXX股份有限公司',
    children: [{
        id: 1,
        label: '技术部',
        children: [{
            id: 4,
            label: '后端工程师'
        }, {
            id: 5,
            label: '前端工程师'
        }, {
            id: 6,
            label: '运维工程师'
        }]
    }, {
        id: 2,
        label: '人事部'
    }, {
        id: 3,
        label: '销售部'
    }]
}

<OrgTree
    data={data}
    horizontal={horizontal}
    collapsable={collapsable}
    expandAll={expandAll}
>

效果

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

About the Author

每个人都有自己得时区,在自己得时区里,一切都是准时的。

BlockSpare — News, Magazine and Blog Addons for (Gutenberg) Block Editor