はじめに
みなさんは、Figma Widget を開発する際、非同期処理を行いたいと思ったことはありますか？
この記事では、Figma Widgetで非同期処理を行う方法について解説しようと思います。
非同期処理を行う
非同期処理を行うには、waitForTask という関数を使う必要があります。
waitForTask 関数は、引数に Promis を受け取り、Promis が解決されるまでウィジェットを維持します。
waitForTask(task: Promise<any>): void
waitForTask 関数の主な使用方法は、ウィジェットが挿入されたときにデータをフェッチすることです。
useEffect と組み合わせることで、iframe 経由でネットワークリクエストを行い、その応答をウィジェットの状態に保持できます。
使い方
waitForTask 関数は、以下のように引数に Promis を渡します。
waitForTask( new Promise(() => {
/* 非同期処理 */
}))
まとめ
この記事では、Figma Widgetで非同期処理を行う方法について解説しました。
ぜひこの記事を参考に、Figma Widgetで非同期処理を行なってみてください！
最後まで読んでくださってありがとうございます！
普段はデザインやフロントエンドを中心にQiitaで記事を投稿しているので、ぜひQiitaのフォローとX(Twitter)のフォローをお願いします。