✒️SAP BTPFIORI / El enrutamiento en aplicaciones SAPUI5 Por Roberto Santucho
El enrutamiento en aplicaciones SAPUI5
1. LA NAVEGABILIDAD EN UNA APP SPAUI5
- nav. basada en rutas: permite crear una single-page y navegar SIN RECARGAR LA PAGINA.
- PARA ESTO ES NECESARIO IMPLEMENTAR UN ROUTER, LAS CONFIGURACIONES DE ENRUTAMIENTO SE HACEN EN EL DESCRIPTOR DE LA APP manifest.json
- ROUTING: proceso en el que se cambia de vista.
- single-page navigation se refleja EN EL HASH DE LA URL, en lugar de la ruta del servidor o los parametros de URL
- en una app SAPUI5, LA CLASE DE ENRUTADOR
- CAPTURA todos los cambios en el hash y carga diferentes vistas segun la configuracion del enrutador.
- mantiene seguimiento del historial
- proporciona tambien formas de realizar la navegacion sin actualizar ni el hash ni e historial
2. LA CONFIGURACION DEL ENRUTADOR
- la configuracion es parte del manifest.json de la app SAPUI5, donde se indican rutas y que vistas/targets se instanciaran para diferentes rutas
- la configuracion puede hacerse:
- GLOBALMENTE: utilizamos manifest.json
- LOCALMENTE: utilizar clases, route y targets ubicadas en los namespaces sap.ui.core.routing y sap.m.routing.
2.1 COMO SE DEFINEN LAS RUTAS Y OBJETIVOS?
Los namespaces mas habituales en una app SAPUI5 son:
- app
- ui
- ui5
Dentro del atributo routing del namespace sap.ui5 en el archivo manifest.json se definen las configuraciones para rutas y enrutadores.
HAY 3 SUBSECCIONES QUE DIFINEN LA ESTRUCTURA DE ENRUTAMIENTO Y NAVEGACION DE LA APP:
- La propiedad config: CONFIGURACION GLOBAL DEL ENRUTADOR Y LOS VALORES PREDETERMINADOS QUE SE APLICAN A TODAS LAS RUTAS Y DESTINOS. Solo ajustes excepcionales, SOLO ASEGURARNOS QUE LA RUTA CORRECTA A LAS VISTAS ESTE EN "viewPath"
- viewType: tipo de vista predeterminada que se usa en toda la aplicaccion.
- viewPath: define la carpeta predeterminada donde se encuentran todas las vistas
- controlId: id del control donde se renderizaran las vistas
- controlAggregation: agregacion donde se renderizaran las vistas.
- La propiedad routes: rutas o navigaciones validas dentro de una app
- pattern: patro para la parte hash de la URL para la que la actual ruta es valida. Se selecciona la primera encontrada, entonce ES IMPORTANTE LA SECUENCIA de rutas
- name: debe ser unico para la ruta.
- La propiedad targets: cada target tiene un nombre y se especifica un viewName. La vista puede estar asociada a una o mas rutas
- transition: animacion asociada
Un objetivo se puede mostrar directamente en la app MEDIANTE PROGRAMACION sin asociarlo con una ruta.
Ejemplo: this.getRouter (). getTargets(). display ("notFound");
3. ANALIZANDO LA NAVEGABILIDAD DE UNA APP
En la de maetro-detalle, se pueden dar 3 casos
- se selecciona un item en la vista de detalle, se cambia el hash de la URL, SAPUI5 considera la configuracion de enrutamiento y elige el target para mostrar
- cuando el metodo navTo del router is invocado, SAPUI5 considera la configuracion de enrutamiento, se cambia el hash de la URL y navega
- llamada al metodo getTargets() , el marco SAPUI5 considera la configuracion de enrutamiento y navega hasta el target especificado en el hast de la URL.
FUNCIONES DEL ROUTER (ENCARGADO DE CONTROLAR LA NAVEGACION):
- Escuchar los cambios del hash
- Manipular el hash
- Comparar el hash con los patrones de las rutas
4. LA INICIALIZACION DEL ENRUTAMIENTO
El router debe inicializarse explicictamente en el componente para que este disponible a lo largo de la app: AL INSTANCIARSE (OCURRIRA UNA VEZ POR APLICACION) , LAS CONFIGURACIONES INGRESADAS EN MANIFEST.JSON SON CARGADAS.
en el init del manifest.js this.getRouter().initialize();
Escanear / Compartir
Sobre el autor
Publicación académica de Roberto Hernan Santucho, en su ámbito de estudios para la Carrera Consultor SAP BTP Fiori.
Roberto Hernan Santucho
Profesión: Ingeniero en Sistemas - Mexico - Legajo: VA51C
✒️Autor de: 43 Publicaciones Académicas
🎓Egresado del módulo:
Certificación Académica de Roberto Santucho
Disponibilidad Laboral: FullTime 
