Red de conocimiento informático - Problemas con los teléfonos móviles - Utilice vue+elementUi para desarrollar mesas de trabajo de edición extensibles y de arrastrar y soltar

Utilice vue+elementUi para desarrollar mesas de trabajo de edición extensibles y de arrastrar y soltar

En los últimos días, he estado usando Vue para implementar una pequeña función de edición dinámica de plantillas, que incluye arrastrar divs libremente, estirar divs libremente, configurar libremente el ancho, el color del contenido del texto, agregar y eliminar los divs correspondientes, etc.

Actualmente La dirección git del componente

Explicación detallada del componente actual empaquetado en un artículo del complemento npm

La siguiente es la interfaz específica. Un poco tosco, por favor no te quejes

Ahora comencemos a discutir cómo implementarlo

Primero, usaremos las propiedades personalizadas de vue para definir una directiva llamada v-drag

p>

El propósito de incluir parámetros es evitar que el div exceda los límites del lienzo durante la operación de arrastrar y soltar

Continuaremos mejorando la función y agregaremos algunas características nuevas más adelante