[Vuejs]-Pass nested object name as props to component

by

0👍

✅

first of all I see you are mutating a prop from the child component which is a bad practice as it is, so consider changing it to use v-model on the parent component or emit the property and value you want to change from the child to the parent.

As for question about ‘birth.date’ for example – you can not pass it to v-model because JavaScript doesn’t know to address this string as a deep object, so when you try to access parsedInfo['birth.date'] it looks for the matching string in the parsedInfo object, not as a deep object.

(if parsed info was: parsedInfo = { 'birth.date': '' } it would have find a value)

so I think the easiest way to achieve your goal is to use lodash _.set(obj, property) method, See: https://lodash.com/docs/4.17.15#set

if you want to use it with v-model you can use a computed property with get and set methods like so:

infoProperty: {
    get: {
      // return the info[property]
    }
    set: {
      // use the _.set(obj, property) method
    }
}

Leave a comment