Lightning-覆盖标准按钮（2）

通常，当我们考虑Lightning组件时，我们会考虑Lightning Experience中页面上的元素。换句话说，我们想到了前端设计 – 用户在页面上的交互。但是我们也可以构建根本没有任何前端标记的Lightning组件。但是你可能在想，为什么有人会那样做呢？因为我们也可以使用Lightning组件作为可重用的服务或服务组件。

在这一步结束之后，您将会：

• 了解服务组件的概念
• 检索选项列表值列表
• 传递两个组件之间的值

创建闪电组件

1. 在开发者控制台中，选择 File > New > Lightning Component.
2. 对于名称，输入： PickListValues 并单击 Submit.

   请注意，我们没有检查任何框，因为我们不打算将这个组件作为一个独立的组件在页面上使用。相反，我们将其用作PropertyDialog组件的子组件，或者将其用作需要选项列表值的任何其他组件的子项。

3. 将以下内容添加到<aura：component>标记内的组件中：

   <aura:attribute name="sObjectName" type="String" />
   <aura:attribute name="fieldName" type="String" />
   <aura:attribute name="picklistValues" type="Object" />
   

   因为这是一个服务组件，它唯一要做的就是存储一些值。在我们的情况下，我们想知道状态选项列表的值。我们将把它们作为值存储在<aura：attribute name =“picklistValues”/>中。
4. 保存文件。

检索选项列表值

1. 在开发者控制台中，点击 File > New > Apex Class.
2. 命名类： PickListController
3. 将以下内容添加到 class:

   @AuraEnabled        
   public static List<String> getPickListValuesIntoList(String objectType, String selectedField){
       List<String> pickListValuesList = new List<String>();
       Schema.SObjectType convertToObj = Schema.getGlobalDescribe().get(objectType);
       Schema.DescribeSObjectResult res = convertToObj.getDescribe();
       Schema.DescribeFieldResult fieldResult = res.fields.getMap().get(selectedField).getDescribe();
       List<Schema.PicklistEntry> ple = fieldResult.getPicklistValues();
       for( Schema.PicklistEntry pickListVal : ple){
           pickListValuesList.add(pickListVal.getLabel());
       }     
       return pickListValuesList;
   }
   

   我们称之为Lightning组件的Apex方法，我们需要使用@AuraEnabled和静态签名。 getPickListValuesIntoList方法接受两个参数，objectType和selectedField。我们将ObjectType变量作为String传递，所以我们把String转换成Object，然后得到它的字段列表。然后我们检索选取列表值，为每个值添加标签，最后返回列表。
4. 保存文件。

把它连接起来

1. 在开发者控制台中，切换回PickListValues组件。
2. 将controller =“PickListController”access =“global”添加到<aura：component>标记。
3. 在aura属性之后的新行中，将以下内容添加到组件中：

   <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
   

4. 保存文件。
5. 单击侧面导航中的“控制器”以将控制器添加到组件。
6. 将控制器中的代码替换为：

   ({
       doInit : function(component) {
           var action = component.get("c.getPickListValuesIntoList");
           action.setParams({
               objectType: component.get("v.sObjectName"),
               selectedField: component.get("v.fieldName")
           });
           action.setCallback(this, function(response) {
               var list = response.getReturnValue();
               component.set("v.picklistValues", list);
           })
           $A.enqueueAction(action);
       }
   })
   

   这个非常简单的函数调用我们刚刚创建的Apex类的getPickListValuesIntoList方法，然后将它们存储在picklistValues属性中。

7. 保存文件。

添加服务组件

1. 在Developer Console中，切换到PropertyDialog组件。
2. 在打开<aura：component>标记之后添加对PickListValues组件的引用：

   <aura:attribute name="picklistValues" type="Object" />
   <c:PicklistValues sObjectName="Property__c" fieldName="Status__c" picklistValues="{!v.picklistValues}" />
   

   当我们向另一个Lightning组件添加一个子组件时，我们也可以设置子组件中包含的属性。这些值可以是显式定义的，就像我们在这里做的那样，或者是根据绑定到父组件的属性来动态分配的。当Apex类返回值时，我们在子组件中设置picklistValues属性。然后，这个值将起泡到<c：PicklistValues>上的属性定义，该属性定义依次在父组件中设置。啊，数据绑定的美丽！
3. 将<lightning：select>中的<option value =“status”> Status </ option>替换为：

   <aura:iteration items="{!v.picklistValues}" var="item">
       <option value="{!item}">{!item}</option>
   </aura:iteration>
   

   现在，将使用picklistValues属性中的条目来动态填充<lightning：select>。
4. 保存该文件，然后刷新组织中的属性记录页面。

   如果一切顺利，而不是“状态”一词，正确的值显示在您的状态选项列表中。

   做得好！ 现在我们需要做的就是连接组件，以便能够保存新的属性记录。