v-model with ternary expression reaching object value

March 1, 2023

When I try ternary expression with v-model I can reach to data (in this code example : name:’data_value’) inside data() but when I try to reach "detailCompanyDatas.smCompany.name" I can not. What should I do?

thanks

 <v-text-field
       v-model="$data[dialogDetail ? 'name' : null]"
    />  // this works

   <v-text-field
       v-model="$data[dialogDetail ? 'detailCompanyDatas.smCompany.name' : null]"
    />  // not works

   data () {
       return {
         dialogDetail: true,
         detailCompanyDatas: {
           smCompany: {
            name: 'object_value'
          }
        },
        name: 'data_value',
      } 
     }

>Solution :

You can bind v-model to a writable computed :

  <v-text-field
       v-model="companyName"
    />

      data () {
        return {
          dialogDetail: true,
          detailCompanyDatas: {
            smCompany: {
             name: 'object_value'
           }
         },
         name: 'data_value',
       },
     computed:{
         companyName:{
                get(){
                  return this.dialogDetail? this.detailCompanyDatas.smCompany.name : null
                },
                set(val){
                  this.detailCompanyDatas.smCompany.name = this.dialogDetail? ? val:null
                }
  
            }
          } 
      }
</script>