2

アプリケーション全体で再利用できる再利用可能なmvc4UIコンポーネント/コントロールを作成したいと思います。インターネット（主にmvc3）にはこれに関する多くの情報がありますが、不完全または具体的すぎるようです。

一般的なアプリケーションのアーキテクチャは、通常のリクエストまたはajaxリクエストからレンダリングされたhtmlを返すことです（質問がSinglePageAppモデルを参照していないことを明確にしたかったので、コンポーネントはサーバー上にあり、クライアント側モデルを持っている可能性があり、通信は行われませんjson webapiを使用）

問題は、「以下に説明するように動作するようにコンポーネントを作成するのに最適な方法は何ですか？」です。

再利用可能なコンポーネントには、次の特性が必要です。

  • 同じアプリケーションのさまざまな場所/ビューで再利用する必要があります（これはアプリ固有であり、将来の使用のために別のライブラリにパッケージ化することを意図したものではありません）
  • 開発者が読みやすいように、宣言型のマークアップが必要です（拡張メソッド、TagBuilderなどはありません）。
  • 動作を指定するオプションのリスト（showCloseBtn：true、SaveUrl：{...}）、イベントを処理するためのイベントハンドラー、および必要に応じてデータモデル（htmlコントロールにバインドするため）を受け取る必要があります。
  • それは観察可能です。イベントを生成し、それらのイベントに登録されているすべての人に通知できます（つまりクライアント側）。同様の動作はtelerikコントロールでも発生しますが、この場合、宣言型アプローチの制限があります（クラスライブラリを構築したくありません）。

サンプル：

@(Html.Telerik().Upload()
    .Name("attachments")
    .ClientEvents(events => events
        .OnLoad(
        @<text>
            function(e) {
                // Perform required actions here.
            }
        </text>)
    )
)
  • 一部のコンポーネントはページごとに1回だけ使用され、その他のコンポーネントはオプションパラメータに応じて複数回表示される可能性があります
  • 各コンポーネントは、htmlとjavascriptをレンダリングする必要があります
  • クライアント側からコンポーネントをリクエストできると便利です

例（これは質問を明確にするためのものであり、解決する必要のある特定のケースではありません）：

一部の部門の役割を管理するアプリケーションがあるとします。Name、Age、DepartmentIdを持つPersonエンティティがあります（1つの部門にのみ属することができると想定しています）。Name、Ageのラベル/テキストボックスとdepartmentのddlを持つEdit/InsertのPersonComponentフォームを作成します。Savebtnもあります。save btnをクリックすると、コンポーネントの初期化方法に応じて、フィールドからすべてのデータを取得し、ajax呼び出しを行ってjsonデータをurlに送信し（urlはparamとして受信されます）、Saveイベントを誰にでもディスパッチします。登録済み。保存イベントハンドラーには、jsonデータを含むパラメーターがあります。コンポーネントにパラメータとしてURLが送信されていない場合は、すべてのリスナーに通知します。

各部門には、コンポーネントを再利用できるさまざまなビューがあります。1つのページに、一度に複数の部門を表示できます。

考慮事項：

  • このコンポーネントを作成するには、宣言型のHtmlHelpers、PartialViews、またはRenderActionヘルパー（または他のメソッド？）を使用できます。
  • コンポーネントがページごとに1回だけ使用され、ページに複数のコンポーネントがある場合、親コンテナが各コンポーネントのデータを取得する必要をなくすために、各コンポーネントが実際に独自のビジネスデータを取得する方がよい場合があります。
  • 同じコンポーネントが同じページに複数回表示される場合は、JavaScriptコードを複製しないことが望ましいでしょう。（ここに関連する議論があります）
  • PartialViewsの場合、ViewModelはコンポーネントオプション、モデルデータ、およびイベントハンドラーをカプセル化する必要があります。
  • クライアントリクエストへの応答としてHtmlHelperをレンダリングするのは少し奇妙です
  • コンポーネントを再利用できるようにするには、イベントメカニズムを用意することが非常に重要です。一部のHTMLをコンポーネント/コントロールとしてレンダリングするだけでは不十分です
  • アーキテクチャ/ソリューションには、require.js（コンポーネントjsをロードするため）、knockout.jsなどのクライアント側APIを含めることができます。重要なのは、依存関係を過度に複雑にしないことですが、役立つ場合はそれらを使用してください。

ノート：

こことここに似たような質問がありますが、質問の文脈は異なります。

4

0 に答える 0