Esta es una vieja pregunta con múltiples respuestas que funcionan, sin embargo, he descubierto una solución usando lo que Magento proporciona (a partir de 2.1.0) sin la necesidad de extender componentes. Como varias preguntas se han marcado como duplicadas y dirigidas aquí, pensé que sería beneficioso proporcionar alguna información sobre esta opción.
Todos los componentes de la interfaz de usuario del elemento de formulario que se extienden Magento_Ui/js/form/element/abstract.jstienen una switcherConfigconfiguración disponible para fines tales como ocultar / mostrar elementos, así como otras acciones. El switchercomponente se puede encontrar en Magento_Ui / js / form / switcher para los curiosos. Puede encontrar ejemplos de su uso en sales_rule_form.xml y catalog_rule_form.xml . Por supuesto, si ya está utilizando su propio componente personalizado, todavía puede usarlo siempre que su componente finalmente se extienda, lo abstractque parece ser el caso en función del código de ejemplo proporcionado en la pregunta.
Ahora para un ejemplo más específico para responder la pregunta original.
En Namespace/ModuleName/view/adminhtml/ui_component/your_entity_form.xmlsólo hay que añadir lo siguiente a los de campo settingsque realiza el control (es decir, el campo que determina qué campos están ocultos / visibles). En su ejemplo esto sería field1.
<field name="field1">
<argument name="data" xsi:type="array">
...
</argument>
<settings>
<switcherConfig>
<rules>
<rule name="0">
<value>2</value>
<actions>
<action name="0">
<target>your_entity_form.your_entity_form.entity_information.field2Depend1</target>
<callback>show</callback>
</action>
<action name="1">
<target>your_entity_form.your_entity_form.entity_information.field3Depend1</target>
<callback>hide</callback>
</action>
</actions>
</rule>
<rule name="1">
<value>3</value>
<actions>
<action name="0">
<target>your_entity_form.your_entity_form.entity_information.field2Depend1</target>
<callback>hide</callback>
</action>
<action name="1">
<target>your_entity_form.your_entity_form.entity_information.field3Depend1</target>
<callback>show</callback>
</action>
</actions>
</rule>
</rules>
<enabled>true</enabled>
</switcherConfig>
</settings>
</field>
Vamos a desglosarlo un poco. El switchercomponente contiene una matriz de ruleslo que estamos construyendo aquí. Cada uno <rule>tiene un nombre que es un número en este ejemplo. Este nombre es la clave / índice de matriz para este elemento. Estamos usando números como índices de matriz. Las cadenas también deberían funcionar, pero no he probado esta teoría .
ACTUALIZACIÓN : como mencionó @ChristopheFerreboeuf en los comentarios, las cadenas no funcionan aquí. Estas son matrices y deberían comenzar con 0, no con cadenas o 1.
Dentro de cada uno rulepasamos dos argumentos.
value- Este es el valor del field1cual debería desencadenar el actionsdefinido a continuación.actions- Aquí tenemos otra matriz. Estas son las acciones que se activarán cuando se cumplan las condiciones de esta regla. Nuevamente, actionel nombre de cada uno es solo el índice / clave de la matriz de ese elemento.
Ahora cada uno actiontiene dos argumentos también (con un tercero opcional).
target- Este es el elemento que deseas manipular bajo esta acción. Si no está familiarizado con cómo se componen los nombres de elementos ui_component en Magento, puede consultar el artículo de Alan Storm . Básicamente es algo como {component_name}.{component_name}.{fieldset_name}.{field_name}en este ejemplo.callback- Aquí está la acción a tomar sobre lo mencionado anteriormente target. Esta devolución de llamada debe ser una función que esté disponible en el elemento de destino. Nuestro ejemplo usa hidey show. Aquí es donde puede comenzar a ampliar la funcionalidad disponible. El catalog_rule_form.xmlejemplo que mencioné anteriormente se usa setValidationsi desea ver un ejemplo diferente.- También puede agregar
<params>a cualquiera actionque lo solicite. Puedes ver esto también en el catalog_rule_form.xmlejemplo.
Finalmente el último elemento adentro switcherConfiges <enabled>true</enabled>. Esto debería ser bastante sencillo, es un booleano para habilitar / deshabilitar la funcionalidad del conmutador que acabamos de implementar.
Y ya hemos terminado. Entonces, usando el ejemplo anterior, lo que debería ver es el campo que se field2Depend1muestra si elige una opción con valor 2activado field1, y se field3Depend1muestra si elige una opción con valor 3.
He probado este ejemplo usando solo hidey showen un campo obligatorio y parece tener en cuenta la visibilidad para la validación. En otras palabras, si field2Depend1se requiere, solo se requerirá cuando sea visible. No es necesario realizar más configuraciones para que eso funcione.
Espero que esto brinde ayuda para cualquiera que busque una solución más lista para usar.
