computed getter / setter the setter not working
-
i have quasar version 1.6.0 the problem is the get is function but the set not is working i try to do in other clean page and happen the same somebody having this problem ???
<q-btn type="button" color="red" size="sm" label="Cancelar" @click="prueba++"/> export default { data () { return { datos: { nombre: '', paterno: '', materno: '', fechaNacimiento: date.formatDate(Date.now(), 'DD/MM/YYYY'), edad: 0, sexo: '', rfc: '', celular: '', correo: '', descripcion: '' }, edades: 0, options: [ 'Masculino', 'Femenino' ], prueba: 0, prueba2: 0 } }, computed: { edadCliente: { get () { const date1 = new Date() const fecha = this.datos.fechaNacimiento.split('/').reverse().join('/') // const diff = date.getDateDiff(date1, fecha, 'years') // const fecha = dateDisplay.split('/').reverse().join('/') return date.getDateDiff(date1, fecha, 'years') }, set (value) { console.log(value) this.edades = value } }, pruebax: { get () { return this.prueba * 2 }, set (v) { console.log(v) this.prueba2 = v } } } }
-
You are not even using those computed properties in your code.
edadCliente
andpruebax
only present once. You are incrementingprueba
. I am not sure why you are expecting any of theset
to work. -
@turigeza hi yes i didnt put that code cause in the example pruebax should be work with that but the point is get is working and set not that i put the console log but never show arent know is the version or something else but thnx.
-
You are setting prueba not your computed property pruebax. Nothing wrong with vue computed prop, it’s an error on your part.
-
@metalsadman look i know that is not the problem but ok in the last i will past this very clear example i did from this page https://vuejs.org/v2/guide/computed.html in the index #computed setter and again didnt working set is not react only get this is my code and you can check test easy thnx .
<template lang="es"> <q-page class=""> <div id="demo">{{ fullName }}</div> <q-input v-model="firstName" filled type="text" /> </q-page> </template> <script> export default { data () { return { firstName: 'Foo', lastName: 'Bar' } }, computed: { fullName: { // getter get: function () { return this.firstName + ' ' + this.lastName }, // setter set: function (newValue) { var names = newValue.split(' ') console.log(names) this.firstName = names[0] this.lastName = names[names.length - 1] } } } } </script>
-
Sorry, but that doesnt even remotely look close to what you did above, i suggest you post a reproduction codepen.
-
@metalsadman sorry you right this is the link example excuse me for this post thnx so much for you help computed_set
-
@lobo You are updating the wrong variable. In order to
fullName
set
to be called you have to modifyfullName
and notfirstName
-
@turigeza to much thnx your right