Error in nextTick “TypeError Cannot read property ‘xxx‘ of undefined“

created at 03-13-2022 views: 4

solution

This error is reported mainly because the subcomponent is assigned a value before the subcomponent is loaded. It is recommended to use the first one

this.$nextTick( ()=> {
//Modify the content of the child component
         });
         //or
         setTimeout(() => {
        //Modify the content of the child component
}, 50);

The parent component passes the value to the child component, the child component cannot be modified directly, and an error will be reported

//The child component modifies the value of the parent component
this.$emit('name','value');

//The child component calls the method of the parent component
this.$emit('method', val)
//or
this.$parent.fatherMethod();
//or
<child :fatherMethod="fatherMethod"></child>

props: {
       fatherMethod: {
         type: Function,
         default: null
       }
     },


//The parent component modifies the value of the child component
<tag ref="xxx" @b='b'></tag>
this.$refs.xxx.a = 1

//The parent component calls the method of the child component
this.$refs.xxx.b()

Description of parameters set in watch: changes can only be monitored

  • deep: whether to listen deeply
  • immediate: whether to enable when the page is initialized
//Listen for changes in files
  watch: {
   files: {
     handler (newValue, oldValue) {
       console.log(newValue)
       this.fileList = newValue
     },
     deep: true // The default value is false, which means whether to listen deeply
   }
}



//listen for object changes
data() {
 return {
  files: {
   name: 'demo'
  }   
  }
},
watch: {
   files: {
handler(newValue, oldValue) {
console.log(newValue)
},
   deep: true
   }
}

//Listen to the specific properties of the object
data() {
  return {
  files: {
   name: 'demo'
  } 
    }
},
computed: {
  filesName() {
    return this.files.name
  }
},
watch: {
  filesName(newValue, oldValue) {
    console.log(newValue)
  }
}
created at:03-13-2022
edited at: 03-13-2022: