ASP.Net Core: ViewComponent vs EditorTemplate / DisplayTemplate vs @inject

10

Jadi saya sedang mencari cara yang baik di ASP.Net Core untuk membuat beberapa "kontrol" yang membuat tampilan. Sejauh ini saya menemukan ada 3 opsi, dan saya ingin mendapatkan umpan balik.

  1. ViewComponents: Ini seperti pengontrol mini dan menggunakan metode seperti tindakan untuk merender dari halaman silet (tampilan). Saya percaya mereka dapat memiliki logika mandiri sehingga tidak ada ketergantungan pada model tampilan orang tua.

  2. Folder EditorTemplate / DisplayTemplate: Ini ada di bawah "Tampilan / Dibagi /" dan dapat ditarik ke tampilan dengan mengirimkan properti model kepada mereka (menggunakan DisplayFor()atau EditorFor()).

  3. @inject untuk ASP.Net Core: Memungkinkan menyuntikkan tipe ke tampilan (saya tidak tahu apakah tampilan parsial dapat dikaitkan?).

  4. Saya meninggalkan kemampuan untuk menyertakan sebagian pandangan secara langsung, karena itu bukan maksud saya untuk sistem kontrol yang saya porting.

  5. Beri Tag pada Pembantu - dimungkinkan untuk menyuntikkan konteks tampilan saat ini dan membangun kontrol dari ini juga.

Dalam aplikasi ASP.NET MVC yang lebih lama saya memiliki beberapa kontrol yang diberikan dari template (# 2). Namun untuk .Net Core, saya sedang mempertimbangkan kemungkinan menggunakan ViewComponents sebagai gantinya (yang tampaknya lebih kuat) untuk rendering tampilan pisau cukur terkait (kontrol pada dasarnya hanya membungkus pandangan pisau cukur). Untuk saat ini saya akan bereksperimen dengan mengkonversi ke ViewComponents, tetapi akan senang beberapa saran tentang masalah ini, terima kasih

.net-core asp.net-core James Wilkins
sumber

Jawaban:

2

Gunakan ViewComponent jika Anda memiliki beberapa logika bisnis untuk dijalankan. Ini mendukung prinsip Pemisahan Kekhawatiran (SoC). Anda dapat menyuntikkan parameter ke kelas ViewComponent dari tampilan (menggunakan file .cshtml silet). Tampilan ViewComponent dapat ditemukan di Views / Shared / Components . Itu bisa sangat diketik. ViewComponent menggunakan pemanggilan metode asinkron, sehingga pengguna tidak perlu menunggu semua konten dari seluruh halaman dimuat. Selain itu, ViewComponent dapat dipanggil sebagai Tag Helper: Anda perlu menambahkan ViewCompenent Anda sebagai Tag Helper menggunakan direktif @addTagHelpers. Fitur ini memberikan dukungan editor pengembang dalam template editor pisau cukur.

Gunakan Editor / Templat Tampilan saat mengedit atau menampilkan jenis atau kelas tertentu. Misalnya, Anda ingin menentukan bahwa objek Produk harus muncul dengan tabel spesifikasi. Ini menjaga prinsip KERING dalam aplikasi MVC Anda. Ini dapat digunakan sebagai tampilan parsial yang terikat model pada objek yang ingin ditampilkan.

Marcin C
sumber
0

Pendekatan saya adalah sebagai berikut ...

  1. Gunakan ViewComponent untuk merangkum logika bisnis tentang cara mengambil model yang akan ditampilkan
  2. Jika tampilan target sederhana dan / atau letakkan html di sini secara langsung, jika tidak gunakan DisplayTemplate untuk merender model

Dasar pemikirannya adalah saya masih mendapatkan pemisahan antara logika bisnis dan rendering.

Sebagai contoh praktis ambil sesuatu seperti struktur menu konteks tertentu; ViewComponent dapat menentukan menu mana yang akan ditampilkan dan DisplayTemplate kemudian dapat menyajikannya masing-masing.

Paul Hatcher
sumber
Hati-hati menggunakan ini untuk memuat data. Seorang karyawan saya melakukan itu dan kemudian ketika kami ingin membangun API REST untuk AJAX (misalnya, jika seseorang ingin menggunakan Angular), logikanya ada di API dan BUKAN komponennya. ;) Jika tidak menggunakan REST API untuk situs Anda (yang umum hari ini), maka komponen paling baik digunakan untuk rendering hanya dengan mengirimkan data kepada mereka dengan tindakan pengontrol dan mengembalikan hasilnya. Pada akhirnya, saya memutuskan untuk menggunakan Tag Helper dengan konteks tindakan yang disuntikkan untuk membangun kontrol saya sebagai tag dalam tampilan. Itu terlihat jauh lebih bersih pada akhirnya. ;)
James Wilkins
Saya menyuntikkan layanan api ke dalam ViewComponent untuk benar-benar memperoleh data - jika kita membutuhkan logika yang sama mengembalikan target html misalnya untuk menggunakan ajax untuk me-refresh komponen, maka saya memaparkannya melalui metode pengontrol.
Paul Hatcher