Lightning コンポーネント開発者ガイド
jLightning Out のマークアップ
Lightning Out では、ページ上にシンプルなマークアップがいくつか必要です。また、有効化には簡単な JavaScript 関数を 2 つ使用します。
Lightning Out に固有のものは、マークアップと Lightning Out ライブラリの JavaScript 関数のみです。その他のすべては、すでにご存じで愛用されている Lightning コンポーネントコードです。
ページへの Lightning Out の追加
発信元サーバ で Lightning Out の使用を有効にするには、Lightning コンポーネントアプリケーションをホストしているアプリケーションまたはページに Lightning Out JavaScript ライブラリを含めます。ライブラリを含めるには、1 行のマークアップが必要です。
1<script src="https://myDomain.my.salesforce.com/lightning/lightning.out.js"></script>Lightning コンポーネントアプリケーションの読み込みと初期化
$Lightning.use() 関数を使用して、Lightning コンポーネントフレームワークと Lightning コンポーネントアプリケーションの読み込みと初期化を行います。
$Lightning.use() 関数は 4 つの引数を取ります。
| 名前 | 型 | 説明 |
|---|---|---|
| appName | string | 必須。Lightning 連動関係アプリケーションの名前 (名前空間を含む)。たとえば、「"c:expenseAppDependencies"」などです。 |
| callback | function |
Lightning コンポーネントフレームワークとアプリケーションが完全に読み込まれた後にコールされる関数。コールバックは引数を受信しません。 通常、このコールバックで $Lightning.createComponent() をコールしてアプリケーションをページに追加します (次のセクションを参照)。また、別の方法で表示を更新するか、他の方法で Lightning コンポーネントの準備が整ったことに応答する場合もあります。 |
| lightningEndPointURI | string | Salesforce インスタンス上の Lightning ドメインの URL。たとえば、「https://myDomain.lightning.force.com」などです。 |
| authToken | string | 有効な Salesforce セッションのセッション ID または OAuth アクセストークン。 |
appName は必須項目です。他の 3 つのパラメータは省略可能です。通常の使用では、4 つのパラメータすべてを指定します。
ページへの Lightning コンポーネントの追加
$Lightning.createComponent() 関数を使用して、ページに Lightning コンポーネントを追加し、有効にします。
$Lightning.createComponent() 関数は 4 つの引数を取ります。
| 名前 | 型 | 説明 |
|---|---|---|
| componentName | string | 必須。ページに追加する Lightning コンポーネントの名前 (名前空間を含む)。たとえば、「"c:newExpenseForm"」などです。 |
| attributes | Object | 必須。作成時にコンポーネントに設定する属性。たとえば、「{ name: theName, amount: theAmount }」などです。コンポーネントに属性が必要ない場合は、空のオブジェクト { } を渡します。 |
| domLocator | Element または string | 必須。作成したコンポーネントを挿入するページ上の位置を示す DOM 要素または要素 ID。 |
| callback | function | コンポーネントが追加されてページ上で有効になった後にコールされる関数。コールバックは、作成されたコンポーネントを唯一の引数として受信します。 |
内部的には、$Lightning.createComponent() は標準の $A.createComponent() 関数をコールします。DOM ロケータ以外の引数は同じです。さらに、コールを Lightning Out セマンティックでラップしている以外は動作も同じです。