この文章は Salesforce 機械翻訳システムを使用して翻訳されました。詳細はこちらをご参照ください。

イベントの起動

クライアント側のコントローラまたはヘルパー関数でイベントを起動します。force イベントは、Salesforce1 で処理されます。

このデモは、取引先責任者の読み込みで作成した取引先責任者コンポーネントを基に作成されています。

contactList サイドバーで、[CONTROLLER] をクリックして、contactListController.js という新しいリソースを作成します。プレースホルダコードを次のコードに置き換えて保存します。

1swfobject.registerObject("clippy.codeblock-0", "9");({
2    gotoRecord : function(component, event, helper) {
3        // Fire the event to navigate to the contact record
4        var sObjectEvent = $A.get("e.force:navigateToSObject");
5        sObjectEvent.setParams({
6             "recordId": component.get("v.contact.Id"),
7            "slideDevName": 'related'
8        })
9        sObjectEvent.fire();
10    },
11    
12    editRecord : function(component, event, helper) {
13        // Fire the event to navigate to the edit contact page
14        var editRecordEvent = $A.get("e.force:editRecord");
15        editRecordEvent.setParams({
16            "recordId": component.get("v.contact.Id")
17        });
18        editRecordEvent.fire();
19    },
20    
21    navigate : function(component, event, helper) {
22        // Navigate to an external URL
23        var address = component.find("address").get("v.value");
24        var urlEvent = $A.get("e.force:navigateToURL");
25        urlEvent.setParams({
26          "url": 'https://www.google.com/maps/place/' + address
27        });
28        urlEvent.fire();
29    },
30
31    relatedList : function (component, event, helper) {
32        // Navigate to the related cases
33        var relatedListEvent = $A.get("e.force:navigateToRelatedList");
34        relatedListEvent.setParams({
35            "relatedListId": "Cases",
36             "parentRecordId": component.get("v.contact.Id")
37        });
38        relatedListEvent.fire();
39    }
40})

Salesforce1 モバイルブラウザアプリケーションを更新し、次の要素をクリックしてイベントをテストします。
- 取引先責任者名: force:navigateToSObject が起動され、取引先責任者レコードページでビューが更新されます。取引先責任者名は、次のコンポーネントに対応します。
  1<ui:outputText value="{!v.contact.Name}" click="{!c.gotoRecord}"/>
- 取引先責任者の編集アイコン: force:editRecord が起動され、レコードの編集ページが開きます。取引先責任者の編集アイコンは、次のコンポーネントに対応します。
  1<div onclick="{!c.editRecord}"> 2 <img src="/img/icon/custom51_100/pencil16.png" alt="Edit Contact" title="Edit Contact" /> 3</div>
- 住所: force:navigateToURL が起動され、指定した url の Google マップが開きます。住所は、次のコンポーネントに対応します。
  1<div class="col-sm-4"> 2 <ui:outputTextArea aura:id="address" value="{!v.contact.MailingStreet}" click="{!c.navigate}"/> 3</div>

contactsController.js を開きます。hideSpinner コントローラの後に次のコードを入力して保存します。

1swfobject.registerObject("clippy.codeblock-4", "9");createRecord : function (component, event, helper) {
2    // Open the create record page
3    var createRecordEvent = $A.get("e.force:createRecord");
4    createRecordEvent.setParams({
5        "entityApiName": "Contact"
6    });
7    createRecordEvent.fire();
8},
9
10select : function(component, event, helper){
11    // Get the selected value of the ui:inputSelect component
12    var selectCmp = component.find("selection");
13    var selectVal = selectCmp.get("v.value");
14    
15    // Display all primary contacts or all contacts
16    if (selectVal==="All Primary"){
17        var action = component.get("c.getPrimary");
18        action.setCallback(this, function(a){
19            component.set("v.contacts", a.getReturnValue());
20        });
21        $A.enqueueAction(action);
22    }
23    else {
24        // Return all contacts
25        helper.getContacts(component);
26    }
27}

ページをプルダウンして離すと、ページのビューのすべてのデータが更新されます。この動作は、$A.get('e.force:refreshView').fire(); を実行する場合と似ています。

実際に試す: Salesforce1 イベントを起動するコンポーネントを作成するの強調表示された領域をクリックして、コンポーネントをテストできるようになりました。

Salesforce1 とは関係なく使用できるスタンドアロンアプリケーションの作成例については、スタンドアロン Lightning アプリケーションを作成するを参照してください。

Lightning コンポーネント開発者ガイド

No Results

イベントの起動