Tengo una aplicación Vue 2 y está usando el paquete API de composición para poder crear componentes vue con la API de composición.
¿Cómo se crea y usa un setter para una propiedad calculada con la API de composición de Vue?
Estoy mirando los documentos y no veo ninguna documentación para crear un setter para una propiedad calculada. En el conjunto de pruebas, veo un ejemplo :
const b = computed({ get: () => a.value + 1, set: (v) => (a.value = v - 1), }) Sin embargo, no estoy muy seguro de cómo acceder al método set en b . ¿Alguien sabe cómo crear una propiedad calculada con un método establecido para la API de composición? ¿Y cómo puedo usar el método set para poder cambiar el valor de la propiedad calculada?
En un componente vue3, lo usaría así:
<template> <p>a={{ a }} b={{ b }}</p> <button @click="b = 3">Click me</button> </template> <script setup> import {computed, ref} from 'vue'; const a = ref(1); const b = computed({ get: () => a.value + 1, set: (v) => (a.value = v - 1), }) </script> El colocador de b se llama al hacer clic en el botón (asignación b = 3 )
Una alternativa es usar la sección computed dentro de la etiqueta <script> (sin la sección <script setup> ):
<template> <p>a={{a}} b={{b}}</p> <button @click="b = 3">Click me 1</button> </template> <script> export default { name: "Test", data(){ return { a: 1 } }, computed: { b:{ get(){return this.a + 1;}, set(v){this.a = v - 1;} } } } </script>