Estoy usando una directiva v personalizada "v-clip" y requiere un valor. En mi caso, quiero usar 'enlace de datos'. Lo que significa que el valor de v-clip puede cambiar sobre la marcha de otras interacciones en el sitio web.
En este caso, implementé un ejemplo simple en el que cada vez que un usuario hace clic en un botón llamado 'Contador', incrementa el valor en 1. ¿Cómo puedo recuperar el valor más actualizado cuando el usuario hace clic en la directiva personalizada que se imprime en la consola.
¿Hay alguna manera de que pueda usar vnode o algo así para recuperar el valor? Me imagino que la directiva podría hacer que alguien obtenga el valor actualizado.
directiva de clips
Vue.directive('clip', { bind: (el, binding, vnode) => { const clickEventHandler = (event) => { console.log(binding.value) } el.addEventListener('click', clickEventHandler) }, }) Se usa así donde el counter variable se cambia dinámicamente cuando se hace clic en un botón en la interfaz de usuario.
<div v-clip="counter">Clip A {{ counter }}</div>De la guía Vue.js 2 :
Si necesita compartir información entre ganchos, se recomienda hacerlo a través del conjunto de datos del elemento.
Entonces, si entiendo bien tu pregunta, puedes probar de la siguiente manera:
Vue.directive('clip', { bind: (el, binding) => { const clickEventHandler = () => { console.log(el.getAttribute('data-clipvalue')) } el.addEventListener('click', clickEventHandler) el.setAttribute('data-clipvalue',binding.value) }, update: (el,binding) => { el.setAttribute('data-clipvalue',binding.value) } })