上一篇簡單的介紹了自定義的Lookup單選的組件，功能為通過引用組件Attribute傳遞相關的sObject Name，捕捉用戶輸入的信息，從而實現搜索的功能。

我們做項目的時候，可能要從多個表中獲取數據並且選擇相關的記錄（單選或者多選），也可能要獲取不同的變量的值，不一定是Name字段，也有可能在對某個表進行關鍵字搜索基礎上有額外的條件過濾。此公用組件在上述的背景下進行開發，安裝地址如下：https://login.salesforce.com/packaging/installPackage.apexp?p0=04t0I000000f7Ts

安裝後訪問https://<myDomain>.lightning.force.com/auradocs/reference.app， 將myDomain 換成你自己的domain，然後切換到Components -> aura -> c -> CommonLookUp 即可看到此組件的用法以及相關Attribute的描述。

Single Choise：只需要聲明一個類型為CommonLookUpController.SearchResultWrapper的變量，selectedRecord賦值這個變量即可。

searchObjList 代表當前搜索數據要在Account & Contact兩個表中搜索數據， searchFieldMapping2Object代表返回的數據的值取得是Account的Name字段值以及Contact的Name字段值。attribute中還有一些default值，比如singleOrMultiple,默認為true，即單選。searchGroup默認值為 ALL FIELDS，代表SOSL進行搜索時，匹配的模式為ALL FIELDS，其他的attribute的用法，可以自行查看文檔。

<aura:attribute name="selectedRecord" type="CommonLookUpController.SearchResultWrapper"/>
<c:CommonLookup searchObjList="[‘Account‘,‘Contact‘]" searchFieldMapping2Object="{‘Account‘:‘Name‘,‘Contact‘:‘Name‘}" selectedRecord="{!v.selectedRecord}"/> 

Controller.js中只需要通過這個變量獲取相關的屬性即可。 objId對應這條數據的ID，objName對應返回這條數據對應表的API Name，objValue返回的是這條數據要搜索的值，上面設置的searchFieldMapping2Object中field為什麽，即返回的什麽值，objLabel返回的是這條數據對應表的label Name。

console.log(‘objId : ‘ + component.get(‘v.selectedRecord‘).objId);
console.log(‘objName : ‘ + component.get(‘v.selectedRecord‘).objName);
console.log(‘objValue : ‘ + component.get(‘v.selectedRecord‘).objValue);
console.log(‘objLabel : ‘ + component.get(‘v.selectedRecord‘).objLabel);

效果展示：

1. 用戶搜索時的UI展示，列表中左面會標記記錄屬於哪個object，後面是記錄檢索的值

2. 選中後輸出信息，可以根據想要的變量返回不同的結果信息。

Multiple Choise:和 single模式的區別為需要聲明類型為List的變量，並設置給selectedRecordList，singleOrMultiple設置為false即可，其他用法相同。

<aura:attribute name="selectedRecordList" type="List"/>
<c:CommonLookUp searchObjList="[‘Account‘,‘Contact‘]" searchFieldMapping2Object="{‘Account‘:‘Name‘,‘Contact‘:‘Name‘}" selectedRecordList="{!v.selectedRecordList}" singleOrMultiple="false"/>

Controller.js針對list進行叠代輸出展示：

for(var i=0;i< component.get(‘v.selectedRecordList‘).length;i++) {
        var selectedRecord = component.get(‘v.selectedRecordList‘)[i];
        console.log(selectedRecord.objId);
        console.log(selectedRecord.objName);
        console.log(selectedRecord.objValue);
        console.log(selectedRecord.objLabel);
}

效果展示：

1.針對選中的不同的數據，因為可能來自於不同的對象，所以當hover時，會展示當前記錄對應的object的label信息

2. 搜索時，下面的展示數據仍然按照 object label + object value模式展示。

3. 獲取數據的變量同single 模式。

總結：此公用組件作為第一版還有很多不成熟的地方以及沒有進行特別多的測試，歡迎大家下載測試。篇中或者代碼中如果有錯誤的地方歡迎指出，有不懂的歡迎留言。如果小夥伴們覺得關於LookUp組件有需要強化的點，歡迎留言，集思廣益，使組件公用型變得更強。

salesforce lightning零基礎學習(十三) 自定義Lookup組件（Single & Multiple）