ORGANIZZARE LE VIEW IN COMPONENTI

CREARE TAG HELPER PERSONALIZZATI

Creare un componente è importante perché così possiamo riutilizzare tale logica nelle View che compongono l’applicazione. Avremo creato un qualcosa che è testabile in isolamento, infatti come vedremo possiamo creare dei test automatici per comprovare il funzionamento di ogni nostro componente.

Vediamo come si scrive il Tag Helper contenente la logica delle stelline del rating.

Ci sono delle convenzioni da rispettare, il componente chiamandosi RatingTagHelper, nella View Razor il tag sarà rating. Quando l’engine Razor nel codice HTML trova un TagHelper fa una sorta di Model Binding, passando la palla al componente con i valori di cui ha bisogno. @Course.Rating nel nostro caso, valorizzando automaticamente la proprietà Value del TagHelper. Nel suo metodo ridefinito Process crea la logica C# necessaria e nel parametro di output scrive l’HTML. Guarda il codice che trovi nella directory Customization/TagHelpers come sono stati scritti gli altri due componenti. Il codice è commentato.

I VIEW COMPONENT

Ci sono situazioni in cui dobbiamo generare un cospicuo blocco HTML, come ad esempio la paginazione dei corsi.

Un View Component ha la responsabilità di generare una piccola porzione di interfaccia, esso può decidere quale View restituire. Lo possiamo paragonare a un Controller con una sua Action Invoke e la rispettiva View. La differenza è che un Controller gestisce le richieste http, mentre un View Component serve a generare markup. Supporta la Dependency Injection.

Vi sono anche quì delle convenzioni di nomi da rispettare, il nome del componente PaginationBar deve essere seguito da ViewComponent per far capire che si tratta di tale componente. La View creandola all’interno della directory Shared sarà visibile ovunque, favorendo il riutilizzo del codice.

SEGUIRE IL PRINCIPIO DELLA SEGREGAZIONE DELLE INTERFACCE

Per favorire il riutilizzo del codice non possiamo far dipendere il componente da una implementazione concreta che crea un forte accoppiamento e rende inutilizzabile il componente per altri scopi. Meglio fornire al parametro Invoke una interfaccia. IPaginationInfo.