Stimulus FX の発表: スティミュラスのカスタム アクション オプション

この記事は元々 Rails Designer で公開されました

---

最近、Stimulus のカスタム アクション オプションに関する記事を公開しました。これらを使用して、カスタム JavaScript でより高度なアクションを構築する方法について説明します。とても素敵です。詳しく知りたい場合は、記事をチェックしてください!

記事を書き、例として自分のアプリをレビューしているときに、同じカスタム アクション オプションを頻繁に繰り返していることに気づきました。開発者として、そのような繰り返しに不安を感じ始めました。そこで私は、賢明な開発者なら誰でも決めるであろうことを決定しました。それは、パッケージ化することです。 ? ?

これが Stimulus FX です。 GitHub と NPM にもあります。

使い方は簡単です。お気に入りのツールを使用してパッケージを追加した後、必要なのは次のとおりです:

// Import everything
import { registerActionOptions } from "stimulus-fx";
registerActionOptions(application);

// Or import specific actions
import { whenOutside } from "stimulus-fx/actions";
application.registerActionOption("whenOutside", whenOutside);

次に、whenOutside オプションについては、HTML で次のように使用できます。

<div data-controller="dropdown">
  <ul data-dropdown-target="menu" data-action="click@window->dropdown#hide:whenOutside">
  </ul>
</div>

Stimulus FX には現在 4 つのかわいいアクション オプションがありますが、すぐにさらに追加する予定です。 OSSでもあるので改善にご協力ください！ ❤️

以上がStimulus FX の発表: スティミュラスのカスタム アクション オプションの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。