はじめに
PowerApps Component Frameworkでコードコンポーネントを実装するときにイベントの実装方法に困っていました。なんとか出来たので、その方法の備忘です。
前提条件
今回の実装には、いまだプレビューですが「React」テンプレートを利用しています。
イベント定義
イベントの定義は次のように、マニフェストファイル：「ControlManifest.Input.xml」で行いますが、ビルドしても型定義ファイルが作成されません。
ということで、自分で型定義を拡張する必要があるようです。
次のように「ContextExtended.ts」でparameter として渡ってくる型にイベントを追加します。
イベント実装
まず、コンポーネント部の記述する「xxxx.tsx」に、拡張した型定義をインポートします。
インターフェイス部分のイベントハンドラ用のプロパティを追加後、コンポーネント（以下の例では、CompoundButton)のクリックイベントハンドラにイベントハンドラ用プロパティを設定します。
さらに、呼び出し部分の「index.ts」にコンポーネント側で実装したイベントハンドラ用プロパティに実装したイベントを設定します。実装イベント内で、マニフェストファイルで定義したコードコンポーネントのイベントへボタンクリックを通知し、あわせて変更状態の通知も行います。
動作確認
動作確認の為、環境へアップし次のようにキャンバスアプリ上でコンポーネントを追加します。
イベントが追加され、マニフェストファイルで追加した初期値も正しく設定されているのが確認できます。
イベント動作確認のため、初期値で設定したPowerFXの式UpdateContext({varPCFButtonClick:"PCFボタンがっクリックされました"})の変数をテキストラベルに参照します。
クリックすると、ただしくテキストラベルに文字列が表示されました。
さいごに
今回はPCFを使って、コードコンポーネント上でイベント実装する方法を解説しました。プロパティだと、マニフェストファイルに書くと型定義が作られるますが、イベントは違うようなので注意が必要です。