如何描述清楚一個組件

如何能快速的瞭解組件

分爲四個部分功能說明、使用說明、組件關係、核心邏輯

如下：

1. 功能說明
   支持對人員的單選或多選，返回一個人員列表數組；
   支持設置默認值、修改已選數據
2. 使用說明

	@param   {String/Number} [title]  標題內容
	@param   {Boolean} [isSingle]  是否是單選
	@param   {Array} [afferentData] 傳入的已選數據
	@param   {Function}  [peopelGroupBack] 回調函數
	提供的外部調用的方法
	this.$refs.personnelSelection.open()	// 打開組件
	this.$refs.personnelSelection.close()	// 關閉組件
	this.$refs.personnelSelection.editCachePickData(data) // 修改已選中的數據，data爲修改後的數據
	eg：<personnelSelection 
					:isSingle="false"  
					:afferentData="afferentData"     
					title="加簽人"  
					ref="personnelSelection"
					@peopelGroupBack="peopelGroupBack"></personnelSelection>

3. 組件關係
4. 核心邏輯
   4.1 主體思路
   4.1.1 personnelSelection中getDefaultData方法獲取當前人所在的部門人員信息，數據返回後加工處理賦值給peopleList，並把數據賦值給cacheDefaultData進行緩存，ulSelected獲得後進行展示
   4.1.2 Dsearch進行搜索觸發personnelSelection中searchFun方法在全公司進行搜索，返回10條數據，數據返回後加工處理賦值給peopleList，ulSelected獲得後進行展示
   4.1.3 點擊人員列表，觸發ulSelected中listFun方法，通過dataComparison方法進行數據比對，返回已選的人員數組pickData到personnelSelection
   4.2 主要組件
   ulSelected的主要功能是展示列表、返回已勾選的數據
   4.2.1 父組件把人員列表data和已選的人員數據pickData傳遞到ulSelected組件中，在ulSelected組件中進行數據對比，當執行點擊操作後，進行數據對比，在把數據返回到父組件中
   4.2.2 核心代碼

   ulSelected的參數和主要方法
     @param   {Boolean} [isSingle]  是否是單選類型
     @param   {Array} [data]  展示的人員數據
     @param   {Array}   [pickData]  已選的人員數據
     @param   {Function}   [peopelCallBack]  選中後的回調函數，參數是已選中的數據
   
       /**
        * 點擊某條數據，觸發的數據操作，判斷是在選中列表中寫入還是刪除
        * @param {Object} [item] 某條被點擊的數據
        */
       listFun(item) {
           let pickData = this.pickData.slice()
           let obj = this.dataComparison(item)
           if(obj.state){
               pickData.splice(obj.index, 1)
           }else {
               if(this.isSingle){
                   pickData = [item]
               }else{
                   pickData.push(item)
               }
           }
           this.$emit('peopelCallBack', pickData)
       },
       /**
        * 數據對比，對比當前數據是否在已選擇的數據列表中，返回一個對象，是否存在，存在角標號碼
        * @param {Object} [item] 當前要對比的數據
        */
       dataComparison(item) {
           let returnData = {state:false}
           let pickData = this.pickData.slice()
           pickData.forEach((ele, index) => {
               if(ele.onlyId === item.onlyId){
                   returnData = {
                       state:true,
                       index: index
                   }
               }
           });
           return returnData
       }