Descarga de Sol_Ajax_Spa_MVC_Core - Descarga del código fuente de Sol_Ajax_Spa_MVC

Sol_Ajax_Spa_MVC_Core

Otras categorias

1.0.0

Descargar

? Aviso importante: este repositorio está archivado

¡Gracias por tu interés en este proyecto! A partir del 10 de agosto de 2024, decidimos archivar este repositorio. ¿Qué quiere decir esto?

Sin nuevos desarrollos: no desarrollaremos activamente nuevas funciones ni solucionaremos problemas.
Solo lectura: el repositorio ahora es de solo lectura. Aún puedes clonarlo, pero no se aceptarán más cambios.
Soluciones alternativas: si está buscando soluciones alternativas o proyectos similares, considere explorar el siguiente enlace: Artículo mediano: Cómo convertir aplicaciones ASP.NET Core MVC en aplicaciones de una sola página usando AppRun

Aplicación de una sola página en Asp.net core (Spa MVC Core)

Mejor enfoque para convertir una aplicación ASP.NET Core en una aplicación de una sola página utilizando la metodología Ajax. El lema principal es reducir el esfuerzo del desarrollador mientras trabaja en la creación de un SPA y mejora el rendimiento de la aplicación web tanto en el lado del servidor como en el del cliente.

Punto clave

No es necesario escribir código Jquery para crear una aplicación de una sola página.
La biblioteca Ajax Spa tiene una función ajax incorporada que se llamará automáticamente.
Utilice el enrutamiento predeterminado del lado del servidor.
El desarrollador también puede utilizar otro marco de JavaScript en paralelo.

Nota

Esta biblioteca se aplicará a la solución Asp.net core 3.1 a 6.0.

Configuración

Paso 1:

Instale el siguiente paquete nuget en su solución.

Usando el Administrador de paquetes Nuget:

 PM> Install-Package AjaxSpaMvcCore -Version 1.0.1

Usando .Net CLI:

 > dotnet add package AjaxSpaMvcCore --version 1.0.1

Paso 2:

Vaya al archivo Startup.cs y agregue el siguiente middleware en el método de configuración .

 app . UseAjaxSpa ( ) ;

Paso 3:

Agregue la referencia de ayuda de la etiqueta Ajax spa en el archivo _ViewImports.cshtml dentro de la carpeta Ver.

 @addTagHelper * , AjaxSpaMvcCore

Nota: cree la solución.

Paso 4:

Vaya al archivo _Layout.cshtml y realice el siguiente proceso.

Agregue la siguiente referencia del lado del cliente antes de la etiqueta del cuerpo de cierre

 < script src =" ~/AjaxSpaResource/js/core.js " > </ script >
< script src =" ~/AjaxSpaResource/js/spa.js " > </ script >

Reemplace el método RenderBody() con el siguiente asistente de etiquetas ajax spa, como este

< main role = " main " class = " pb-3 " >
    @* @RenderBody() *@
    < ajax-spa render-body = " @RenderBody() " ></ ajax-spa >
 </ main >

Paso 5:

Aplique el diseño de la página utilizando el método de extensión ApplyLayoutAsync() en el archivo _ViewStart.cshtml .

 @ using AjaxSpaMvcCore
@{
    // Layout = "_Layout";
    Layout = await Context . Request . ApplyLayoutAsync ( " ~/Views/Shared/_Layout.cshtml " );
}