Quando un gran numero di pagine chiama lo stesso risultato di visualizzazione, possiamo racchiudere lo stesso contenuto in un componente di vista, ovviamente possiamo anche passare parametri al componente view e restituire il risultato della risposta, scenari: classifiche, moduli, tabelle, ecc.; questo articolo utilizza asp.net core 3.1 per spiegare come utilizzare il tutorial sul componente di vista ViewComponent.
Componenti della visualizzazione
La componente View è simile a una view locale, ma più potente. Il componente view non utilizza binding del modello, ma si basa solo sui dati forniti quando il modello viene chiamato. Questo articolo è stato scritto utilizzando controller e view, ma il componente view può essere usato anche con Razor Pages.
Visualizza i componenti:
- Renderizza i blocchi invece dell'intera risposta.
- Include la stessa separazione tra preoccupazioni e benefici di testabilità riscontrati tra controller e view.
- Può avere parametri e logica di business.
- Di solito viene chiamato dalla pagina del layout.
I componenti della view possono essere usati ovunque si abbia una logica di rendering riutilizzabile troppo complessa per una visualizzazione locale, come ad esempio:
- Menu di navigazione dinamica
- Tag cloud (dove viene interrogato il database)
- Pannello di accesso
- Carrello della spesa
- Articoli pubblicati di recente
- Contenuti nella barra laterale su un blog tipico
- Il pannello di accesso apparirà su ogni pagina con un link per effettuare il login o il logout, a seconda dello stato di accesso dell'utente
Vista parziale
In asp.net MVC 5 possiamo utilizzare una visualizzazione locale con il seguente codice:
Metodo di chiamata:
ViewComponent è un'alternativa alle visualizzazioni locali.
ViewComponent per iniziare
Visualizza la classe dei componenti:
- L'iniezione di dipendenza del costruttore è pienamente supportata
- Non è coinvolto nel ciclo di vita del controller, il che significa che non puoi usare filtri nei componenti della visualizzazione
- Senza ulteriori indugi, andiamo dritti al punto in cui vogliamo racchiudere la funzionalità componente di una classificazione di aree urbane.
Per prima cosa, crea una nuova cartella "ViewComponents" sotto la directory del progetto e crea un nuovo file di classe "RootClassification.cs" con il seguente codice:
Nella pagina di visualizzazione, creiamo una nuova cartella "Components" sotto la cartella "/Views/Shared" del progetto, poi creiamo una nuova cartella "RootClassification" (questo è l'oggetto con la nuova classe component che abbiamo creato), e infine creiamo un nuovo file "Default.cshtml", il codice è il seguente:
La struttura è la seguente:
Il percorso dettagliato è: /Views/Shared/Components/RootClassification/Default.cshtml
Perché costruire un percorso del genere? Questo dipende da come funzionano i componenti asp.net Core.
Il runtime cerca la vista seguendo il seguente percorso:
/Views/{Controller Name}/Components/{View Component Name}/{View Name}
/Views/Shared/Components/{View Component Name}/{View Name}
/Pages/Shared/Components/{View Component Name}/{View Name}
Il nome di visualizzazione predefinito per il componente view è Default, il che significa che il tuo file view di solito si chiama Default.cshtml. Quando si crea un risultato di un componente di vista o si chiama un metodo View, si può specificare un nome di visualizzazione diverso.
Chiamando, possiamo chiamare dove dobbiamo usare il componente, il codice è il seguente:
Riesegui il progetto con la seguente rendering:
|
Pubblicato il 7-2-2021 16:18:25
|
|
|
|
Pubblicato il 12-08-2021 10:21:01
|
Padrone di casa|
Pubblicato il 13-08-2023 17:55:05
|
