¿ Por qué el formato de la sintaxis de interpolación es { {}}?
Porque en JavaScript, se ha utilizado y definido un par de {} por planificación, y el primero es la especificación, por lo que Vue debe evitarlo para distinguirlo.
¿Beneficios de usar propiedades calculadas? y las definiciones clave-valor en su caché
Beneficios : todos han notado que podemos definir un método para lograr el mismo resultado que una propiedad computada, entonces, ¿por qué usamos tal propiedad como una propiedad computada? Es porque la propiedad computada se almacena en caché en función de sus dependencias. Las propiedades calculadas solo se vuelven a evaluar cuando cambian sus dependencias asociadas. Esto significa que cuando un determinado atributo en los datos no ha cambiado, cuando necesitamos usar el atributo calculado, el atributo calculado obtendrá directa y rápidamente el resultado del cálculo anterior del caché y lo devolverá, en lugar de calcularlo primero como un método. devolver.
Cómo almacenar en caché : el valor clave en el caché es el nombre de la propiedad calculada y su valor calculado.
¿Por qué la clase está vinculada al estilo a través del objeto?
Tanto v-bind:class como v-band:style se pueden vincular a través de objetos y matrices. La vinculación a través de objetos se puede analizar directamente en objetos json para facilitar el análisis
¿Qué operaciones solemos realizar en cada ciclo de vida (antes y después)?
- beforeCreate: generalmente rara vez se usa en desarrollo
- created: todos los estados se han inicializado, y también podemos enviar solicitudes ajax asíncronas para obtener datos en esta etapa. Pero no se puede obtener la opción $el correspondiente, es decir, no se puede obtener el Dom.
- beforeMount: no se realiza la representación, actualización, el DOM virtual está completo, no se crea el DOM real
- montado: se ha creado el DOM real, puede enviar solicitudes asincrónicas para obtener datos y también puede acceder a elementos dom
- beforeUpdate: se puede utilizar para obtener varios datos de estado antes de la actualización
- actualizado: Todos los datos del estado están actualizados.
- beforeDestroy: a menudo borra los temporizadores aquí
- destruido: la instancia de Vue se ha destruido, todos los detectores de eventos se eliminarán y todas las instancias secundarias también se destruirán
manejo de eventos
Escuchar eventos
Puede usar la directiva v-on para escuchar eventos DOM y ejecutar el código JavaScript dentro de las comillas cuando se activa
Métodos de manejo de eventos
Sin embargo, muchas lógicas de manejo de eventos serán más complejas, por lo que no es factible escribir código JavaScript directamente en la directiva v-on. Por lo tanto, v-on también puede recibir un nombre de método que debe llamarse .
como:
<button v-on:click="greet">Greet</button>
Métodos en controladores en línea
Además de enlazar directamente con un método, también es posible llamar a métodos en una declaración de JavaScript en línea:
<button v-on:click="say('hi')">Say hi</button>
modificador de eventos
- .stop: evita que el evento de clic continúe propagándose
- .prevent: previene la acción por defecto con preventDefault
- .capture: use el modo de captura de eventos al agregar detectores de eventos, es decir, los eventos activados por elementos internos se procesan aquí primero y luego se entregan a los elementos internos para su procesamiento
- .self: activa el controlador solo cuando event.target es el elemento actual en sí, es decir, el evento no se activa desde un elemento interno
- .once: agregado en 2.1.4, el evento de clic solo se activará una vez
- .pasivo: agregado en 2.3.0, el comportamiento predeterminado del evento de desplazamiento (es decir, el comportamiento de desplazamiento) se activará inmediatamente sin esperar
onScrolla que finalice , lo que incluyeevent.preventDefault()el caso de
Para admitir navegadores más antiguos cuando sea necesario, Vue proporciona alias para los códigos clave más utilizados
evento personalizado
Comprensión personal, si hay algún error, lo siento mucho, bienvenido a corregirme.