---
title: 员工选择器
order: 1
docGenIncludes:
  - src/components/YwEmpSelector/index.tsx
---



```jsx
import React, { useState,useEffect } from 'react';
import ReactDOM from 'react-dom';
import { YwEmpSelector,YwButton } from '@ywfe/yw-design';
const getOrgList = async () => {
        return new Promise((resolve) => {
          setTimeout(() => {
            resolve(            {
              "orgName": "杭州遥望网络科技有限公司",
              "orgId": "1",
              "subOrgList": [
                { orgId: '2', orgName: '前台', subOrgList: null },
              {
                orgId: '3',
                orgName: '后台',
                subOrgList: [
                  {
                    orgId: '4',
                    orgName: '产研中心',
                    subOrgList: [{ orgId: '6', orgName: '前端', subOrgList: null }],
                  },
                  { orgId: '5', orgName: '法务部', subOrgList: null },
                ],
              },
              ]
    });
          }, 1500);
        });
      };
const getDataSource = async (value) => {
       console.log('value',value)
        return new Promise((resolve) => {
          setTimeout(() => {
            resolve([{"headIconUrl":"https://wework.qpic.cn/wwpic/351104_aQomsUssQTugGDJ_1661360131/0","orgPathDesc":"后台-产研中心-产品部","position":"产品专家","realName":"杨扬","userId":"YWUS48737350231200163E11C7664816","userName":"卓万里","userPhone":"15158133652"},{"headIconUrl":"https://wework.qpic.cn/wwpic/351104_aQomsUssQTugGDJ_1661360131/0","orgPathDesc":"研发部-平台基础组-公共服务组","position":"资深JAVA开发工程师","realName":"张华峰","userId":"U0163E11C76664755963690140871031","userName":"依然","userPhone":"15757161434"}]);
          }, 1500);
        });
};
const getUserListForOrg = async (orgId)=>{
 console.log('orgId',orgId)
        return new Promise((resolve) => {
          setTimeout(() => {
            resolve([{"headIconUrl":"https://wework.qpic.cn/wwpic/351104_aQomsUssQTugGDJ_1661360131/0","orgPathDesc":"后台-产研中心-产品部","position":"产品专家","realName":"杨扬","userId":"YWUS48737350231200163E11C7664816","userName":"卓万里","userPhone":"15158133652"},{"headIconUrl":"https://wework.qpic.cn/wwpic/351104_aQomsUssQTugGDJ_1661360131/0","orgPathDesc":"研发部-平台基础组-公共服务组","position":"资深JAVA开发工程师","realName":"张华峰","userId":"U0163E11C76664755963690140871031","userName":"依然","userPhone":"15757161434"}]);
          }, 1500);
        });
}
const App = () => {
   const [visible,setVisible] = useState(false)
    return (
      <div>
       <YwButton btnText='打开弹窗' type='link' onClick = {()=>{setVisible(true)}}/>
        <YwEmpSelector 
          visible={visible} 
          maxItems = {3}
          getOrgList={getOrgList}
          getUserListForOrg={getUserListForOrg}
          onCancel={()=>{setVisible(false)}}
          defaultValue={[{userId:'U0163E11C76664755963690140871031',userName:'依然'}]}
          getDataSource={getDataSource} 
          onOk={(data)=>{
            console.log(1,data)
            setVisible(false)
          }}
        />
      </div>
    );
}

ReactDOM.render(<App />, mountNode);
```