Red de conocimiento de abogados - Derecho de sociedades - Cómo agregar dinámicamente elementos de formulario en Vue

Cómo agregar dinámicamente elementos de formulario en Vue

En mi proyecto, encontré dos escenarios para agregar elementos de formulario dinámicamente, uno se agrega al formulario y el otro se agrega a la tabla. Me alegré un poco cuando me di cuenta de estos dos. Ahora, mirando hacia atrás, encuentro que estos dos son en realidad iguales y que puedes elegir según tus preferencias personales en el futuro.

Aquí, debido a que los elementos del formulario que se agregarán tienen una relación padre-hijo, hay muchos hijos que agregar y las propiedades de los padres son consistentes, este método puede reducir las operaciones repetidas. No entraré en detalles sobre el estilo del formulario, pero mire la imagen para obtener más detalles

Aquí la pestaña es el contenido que debe insertarse en las pestañas de la matriz cada vez que agregamos un subformulario.

2. Vincule un método addTab() al botón Agregar elemento, que se utiliza para insertar un elemento en la matriz cada vez que se agrega un subformulario.

3. Formatee el formulario. elementos La escritura es la misma que la normal, excepto que el enlace de datos es diferente, debe estar vinculado a los elementos en la pestaña

4. Si desea eliminar pestañas redundantes, debe declarar un removeTab () en

, para eliminar la pestaña correspondiente. Esto es diferente de addTab(), que se define fuera de
. Cada nueva pestaña se insertará al final de todo el formulario.

La tabla aquí también tiene una relación padre-hijo, pero la forma de visualización es diferente. Debido a que aún es necesario mostrar los datos de fondo, se utiliza una tabla para implementarlos.

1. Declare el componente de la tabla bajo una etiqueta