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 and pruebax only present once. You are incrementing prueba. I am not sure why you are expecting any of the set 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 modify fullName and not firstName



  • @turigeza to much thnx your right


Log in to reply