La experiencia en la aplicación IVX desplegable efecto de interacción menú multi-nivel

A menudo hay un escenario de este tipo, algunos de los datos que necesitamos para elegir los casos reales, así como una relación jerárquica clara entre estos datos, tales como la selección de provincias o unidades organizativas, un menú desplegable opciones para la corriente fija después al siguiente nivel el menú desplegable de opciones para cambiar en consecuencia. Hoy para hablar sobre cómo implementar este efecto de interacción menú desplegable de varios niveles.

1. El menú desplegable
menú desplegable es una extensión del componente, seleccione el menú desplegable y haga clic en los componentes del menú desplegable se puede agregar a ampliar las opciones y el menú desplegable para seleccionar el grupo dos sub-componentes, también se puede añadir desplegable opciones de menú en el menú desplegable para seleccionar el grupo, que se utiliza principalmente opciones para un largo tiempo en comparación con la opción de una muestra colectiva.


Podemos cerrar la opción Personalizar, escriba algunas opciones para sí y separados por una coma, a continuación, el menú desplegable y seleccione hemos añadido en el menú desplegable que no tendrá efecto. Abra la opción de personalizar las opciones de visualización del menú desplegable es la opción añadimos una.


En el menú desplegable caso seleccionar la opción, podemos recibir se selecciona un valor de parámetro, la selección actual es el elemento de menú-desplegables. Otros componentes también pueden obtener el valor actual de los menús desplegables seleccionados.


2. La variable común
variable común de variables de datos Tipo de objeto, el valor inicial es objeto nulo "{}". variable común es una estructura en datos variables, para el almacenamiento de datos que tiene una estructura de múltiples etapas. Cuando se utiliza una variable común, la variable puede estar estructurada, los datos pueden ser importados por formato JSON por medio de la adición de un nodo, los niveles de nodos generados automáticamente.

Podemos mirar a la estructura de lo común las variables demo, la propia variable común es un objeto que contiene dos elementos dentro de un objeto, provincia y ciudad, donde la propiedad de la Provincia es una cadena, propiedad de la ciudad es una matriz, y una serie de ciudad cada elemento es un objeto adicional, y este objeto contiene dos sub-elementos y nombre de área, donde el atributo de nombre es una cadena, un área atributo es una matriz, el atributo de área array de cada elemento es un personaje cadena.


3. Caso arquitectura de componentes y los datos de unión

Provincia aquí es relativamente simple, elementos componentes de la Provincia a las variables comunes de enlace de datos de contenido de texto directos.

A continuación, parte de la ciudad, donde se crea un bucle para la opción en el menú desplegable con el menú desplegable. fuentes de datos son genérico de la ciudad matriz variable (nota que para el recipiente debe ser una fuente común de datos para los elementos de la misma variable de atributo común variable de matriz, o una matriz). Entonces dijimos antes de cada elemento de la matriz de propiedad de la ciudad es un objeto y contiene el nombre de dos sub-elementos y superficie del conjunto, vamos a tirar abajo de menú de opciones de los contenidos de vinculaciones para las que el nombre en él.


La última parte de la región, para el bucle más externo para crear una matriz de fuentes de datos son de la ciudad, con el fin de crear la ciudad [0], ciudad [1 ], a la ciudad [2] tres objetos. si el recipiente es señalado nombre y el nombre de la ciudad ha sido elegido por unanimidad de tres de la ciudad [n] objetos en su interior. La segunda capa es el bucle de circulación real para crear crear un menú desplegable. Fuente de datos se filtra antes de que los elementos de superficie objeto ciudad [n], el enlace de datos, es el de datos actual 2, que es el nombre del elemento en el área de la zona de matriz.

4. cascada selector de
hecho, hay un componente puede lograr una funcionalidad similar, pero en lugar de utilizar el estilo del selector-desplegables. Podemos encontrar este selector en cascada en la expansión de selector de montaje.

Es una lista de datos es un conjunto de objetos, una serie de niveles hay que muchas columnas existen, además de la opción final último, en frente de la columna representa el nivel al que pertenece, se ve claramente que el nivel más bajo del número total de elementos de objetos seleccionados el número de líneas que hay una serie de elementos.

En la cascada de selección de los acontecimientos, podemos obtener un parámetro de retroalimentación - el valor seleccionado, la selección actual es el resultado de un selector de cascada, esto es el resultado de un arreglo de la fila de datos. También podemos añadir entre paréntesis después del valor seleccionado para seleccionar sólo una parte del valor seleccionado.


Por supuesto, en otros componentes, también podemos llegar a seleccionar el valor del selector de cascada, o el enlace de datos.

resumen
Para lograr el efecto de menú desplegable de niveles múltiples en conjunto con las variables comunes, las principales mentiras de dificultad en la comprensión de la estructura de las variables comunes. Para mí, entonces, con las filas de la estructura de una matriz de objetos en comparación con la variable común es más como un árbol, en lugar de depender de un elemento específico a las filas, pero de acuerdo a las capas de padres seleccionados. Que podemos encontrar algunas variables comunes se ven en la estructura, y luego más práctica en el caso.