Es imprescindible interpretar el código correctamente previamente a usarlo a tu proyecto y si tdeseas aportar algo puedes dejarlo en la sección de comentarios.
Solución:
Porque estás dependiendo de la entrada v-model para actualizar el keywords propiedad, el valor no se actualizará hasta que el componente Vue se haya vuelto a procesar.
Puede acceder al valor actualizado de keywords en una devolución de llamada pasada a this.$nextTick como en este ejemplo:
new Vue(
el: '#app',
data()
return keywords: ''
,
methods:
queryForKeywords: function(event)
this.$nextTick(() =>
if (this.keywords.length > 2)
console.log("keywords value: " + this.keywords);
);
)
El problema real no tiene nada que ver con vue.js
El problema se esconde detrás de la keydown ¡evento!
Entonces, cuando se activa el evento, el valor de entrada NO se actualiza todavía. Ejemplo de violín
MDN – evento de pulsación de tecla
En general, keydown se utiliza para informarle qué key se presiona. Y puedes acceder a él así:
document.addEventListener('keydown', logKey);
function logKey(e)
console.log(e.key)
Como solución, puedes usar el keyup evento: violín
Mi recomendación es usar un modelo v personalizado usando :value y el @input evento.
Y el guión:
data:
keywords: ''
,
methods:
queryForKeywords(event)
const value = event.target.value
this.keywords = value
if (value.length > 2)
console.log("keywords value: " + this.keywords);
Véalo en acción
valoraciones y comentarios
Si conservas algún reparo y forma de aumentar nuestro ensayo eres capaz de realizar un paráfrasis y con mucho gusto lo analizaremos.