State: Order

Ya mostramos las categorías. Sin embargo, aún no hemos implementado estas dos opciones que son para ordenar los productos por precio y por nombre. ¿De qué manera podemos implementar estos dos? Para ello vamos a dirigirnos a nuestro "store" de productos y estando aquí vamos a modificar nuestro "state". Nuestro estado actualmente tiene un listado de productos tal cual es. Tenemos un “categoryId” que permite filtrar en base a una categoría seleccionada y vamos a agregar entonces una opción más que se va a llamar "orden". Y este order va a ser una cadena indicando cuál es el criterio de orden que queremos aplicar. Por ejemplo, si nosotros queremos ordenar por precio, este order dirá "price". Si queremos ordenar por nombre, este order dirá "name". Básicamente este "string" va a contener en base a que queremos ordenar nuestros productos. Ahora mismo que no existe ningún orden, ¿Cuál es el orden que estamos mostrando? El orden en que se muestran es tal cual sea registrado en este arreglo. No hay un orden determinado, simplemente se muestran los elementos tal cual aparecen en este arreglo. Nosotros podemos hacer que si ordenes es una cadena vacía, no se aplique en ningún orden en particular y los productos se muestren tal cual vienen. Eso es algo que también podemos hacer. Entonces vamos a empezar con esta variable de estado “order” vacía luego la vamos a modificar en base a lo que el usuario seleccione en estas opciones. ¿Entonces, de qué manera podemos modificar el Estado? El Estado lo podemos modificar a través de acciones por ejemplo, vamos a crear una acción “orderByPrice" y vamos a crear una acción ”orderByName". Vamos a tener dos acciones encargadas cada una de ordenar. Podríamos hacer también que la acción reciba el criterio de orden. Sin embargo, en este caso sólo queremos que se invoque la acción y ya internamente nosotros seremos responsables de actualizar el estado.

Crea una cuenta y continúa aprendiendo 🚀

State: Order