他の Lightning コンポーネントから Lightning コンポーネントを呼び出す方法


  1. コンポーネントのインスタンス化: 別の Lightning コンポーネントを呼び出すためには、まずコンポーネントのインスタンスを作成する必要があります。以下のコードは、<c:ChildComponent> という名前の Lightning コンポーネントをインスタンス化する例です。

    <aura:component>
       <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    
       <aura:attribute name="childComponent" type="Aura.Component"/>
    
       <c:ChildComponent aura:id="childComponent" />
    
       <aura:method name="callChildMethod" action="{!c.callChildMethod}">
           <aura:param name="param1" type="String"/>
       </aura:method>
    </aura:component>
  2. コンポーネントのメソッド呼び出し: インスタンス化した Lightning コンポーネントのメソッドを呼び出すには、aura:id を使用してコンポーネントを取得し、call() メソッドを使用します。以下の例では、callChildMethod() メソッドを呼び出しています。

    ({
       doInit: function(component, event, helper) {
           component.set("v.childComponent", component.find("childComponent"));
       },
    
       callChildMethod: function(component, event, helper) {
           var childCmp = component.get("v.childComponent");
           childCmp.call("methodName", "parameterValue");
       }
    })

これらのコード例を使用すると、Lightning コンポーネントから別の Lightning コンポーネントを呼び出すことができます。必要に応じて、コンポーネント間でデータを受け渡すための追加のパラメータやメソッドを実装することもできます。必要に応じて、コンポーネント間の通信を制御するためのイベントやハンドラーも追加できます。

これにより、Lightning コンポーネント間での相互作用を実現し、コードの再利用性と保守性を向上させることができます。