lo que quiero es cuando hago clic en el área de texto, quiero que el valor de la fila sea 10. Si hace clic fuera de la línea Quiero 6, ¿cómo puedo hacer esto? Soy novato en vue js 3. No pude averiguar cómo hacer esto. No pude averiguar cómo hacer con las directivas.
<template> <div> <textarea :rows="row"></textarea> </div> </template> <script> export default { data() { return { row: 6 } } } </script>Prueba como el siguiente fragmento:
const clickOutside = { beforeMount: (el, binding) => { el.clickOutsideEvent = event => { if (!(el == event.target || el.contains(event.target))) { binding.value(); } }; document.addEventListener("click", el.clickOutsideEvent); }, unmounted: el => { document.removeEventListener("click", el.clickOutsideEvent); }, }; const app = Vue.createApp({ data() { return { row: 6, }; }, methods: { setRow() { this.row = 10 }, removeRow() { this.row = 6 } } }) app.directive("clickOut", clickOutside).mount('#demo') <script src="https://unpkg.com/vue@3.2.29/dist/vue.global.prod.js"></script> <div id="demo"> <textarea @click="setRow" :rows="row" v-click-out="removeRow"></textarea> </div>