Creando componentes compartidos
Contenido del curso
Aron Eliezer Lopez Agurcia
Juan Carlos miranda
Javier Eduardo Morón Mendoza
Diego Alejandro Gentner Polanco
Jesus David Mendez Coronell
Erick Estrada Mancilla
Mateo Olaya Garzon
Alvaro ramirez
Juan Daniel Diaz Jaramillo
BALFRE VAZQUEZ CASTREJON
Miguel Teheran
Profesor
Joel Angel David Barrantes Palacios
German Camilo Guarnizo Lizcano
Rafael Humberto Rubiano Novoa
Roger Ullilen Echeverria
JOSE CATAGUA
Miguel Teheran
Profesor
Juan Betancur
Miguel Teheran
Profesor
ROMMEL DUAREZ SAENZ
Erick Fariñas
Cristina Alejandra Morales Oñate
Esteban Cerda Román
Ahora que empiezo con el curso, veo que el proyecto utiliza net8.0, y en su estructura no aparece la carpeta "Shared".
Para poder solucionarlo en efecto es necesario crear la carpeta y en cada archivo en la carpeta "Pages" se tiene que agregar
@using {nombre aplicación}.{nombre archivo}
Gracias por el aporte!
Otra solución es, después de crear la carpeta /Shared también podemos agregar el @using {nombre aplicación}.Shared directamente en el archivo _Imports.razor lo que pondrá en el contexto de la aplicación todos los archivos que estén dentro de esa carpeta, de la misma manera que propone la estructura original con @using {nombre aplicación}.Layout
Si a alguien está usando VS 2022 Community y el IDE no reconoce como declarado el componente ModuleTitle prueben reiniciando el IDE porque a veces se buguea el Intellisense. En mi caso incluso cambié el nombre pensando que era error del código, pero no es así.
A mi me paso con VS Code y lo solucioné de la misma forma
dotnet clean
En versiones recientes de .Net la carpeta shared fue renombrada a Layouts para guardar componentes que están relacionados con el diseño o la estructura visual general de la aplicación (como menús de navegación específicos o barras laterales)
Si los componentes que vas a crear son de uso general como en este caso, lo que debemos hacer es crear la carpeta Shared y guardar ahi dichos componentes
Finalmente para que podamos usarlos en la aplicación, debemos modificar el archivo _Imports.razor y añadir la siguiente linea:
@using BlazorApp.Shared
En mi caso BlazorApp es el nombre de mi aplicación, debes reemplazarlo por el nombre de tu aplicación :)
Entiendo que si la empresa te obliga a trabajar con blazor no te queda de otra. Pero, si puedes escoger prefiero hacer el cliente con React o angular o algo parecido.
Para los que estan usando la versión 8.0 no les va a aparecer la carpeta "Shared" en este caso el nombre de ahora es "Layout"
Estos componentes comparitdos deberian incluir estilos o solo html tags?
Pueden tener sus propios estilos también.
No me funcionaba lo del los titulo a pesar que descargue todos los archivos del github del profesor, asiq ue lo que hice fue lo siguiente:
Moduletitle.razor
~~~
@using System.ComponentModel.DataAnnotations
<h2>@Title</h2> @code{ [Parameter] [Required] public string Title { get; set; }}
~~~
y en la pages llamas al componente compartido como se hace ene l video:
~~~
<ModuleTitle Title="Counter" />
~~~
A mí no me traía la carpeta de shared, tuve que crearla y luego no me funcionaba el ModuleTitle, tuve que agregar la carpeta shared en el archivo _imports.razor
A mi también me toco hacer ese paso:
@using Blazorappdemo.Shared
Luego reiniciar VSCode
no se crea la carpeta Shared
en el moduleTitle me sale: El elemento propiedad "Title" que no acepta valores NULL debe contener un valor distinto de NULL al salir del constructor. Considere la posibilidad de declarar el elemento propiedad como que admite un valor NULL.
Si es un parametro requerido sale de esa manera. En las nuevas verions de C# string no acepta nulos por defecto.
Todo me funciona muy bien pero no me pinta el componente en verde, ademas me sale con una advertencia. ¿como puedo hacer para que no salga la advertencia?
Hola Juan los warning salen en la cosola o depronto pasando el mouse por encima puedes ver de que se trata, tal vez algun aprametro requerido no se esta enviando o los espacios que tienes entre title y le mensaje también pueden afectar. De todas formas revisa la consola o pasa el mouse sobre el warning que seguro te dirá el por que
no reconoce al componente
Está muy interesante, me gusta que sigue más o menos la misma implementación de react, ha hecho menor la curva de aprendizaje para mí
En Blazor, la carpeta Shared sigue existiendo en la versión 8.0, pero ahora también se utiliza una carpeta Layout para organizar los componentes de diseño. La carpeta Shared generalmente contiene componentes reutilizables que pueden ser utilizados en diferentes partes de la aplicación, mientras que la carpeta Layout se utiliza específicamente para componentes de diseño que definen la estructura general de la aplicación, como menús, encabezados y pies de página
No logré que corriera con las diversas alternativas comentadas. Me funcionó, fue generar el ModuleTitle, dentro de Layout.
