github地址:https://github.com/artdong/react-org-tree
react-org-tree
A simple organization tree component based on react
Installation
# use npm
npm i react-org-tree
# use yarn
yarn add react-org-tree
Usage(使用方法)
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}
>
Preview (預覽)
橫向(horizontal)
縱向(vertical)
部分展開(expand)
全部展開(expandAll)
經典前端面試題每日更新,歡迎參與討論,地址:https://github.com/daily-interview/fe-interview。
更多angular1/2/4/5、ionic1/2/3、react、vue、微信小程序、nodejs等技術文章、視頻教程和開源項目,請關注微信公眾號——全棧弄潮兒。