After the vue parent component updates the data through the ref call child component method, the view is not updated

after the vue parent component updates the data through the ref call child component method, the view part updates

and calling the unified method in the subcomponent mounted () {} can update

vue version 2.5.15

parent.vue

this.$nextTick(() => {
        this.$refs.carInfo.getDetail(data)
      })

child.vue

data () {
    return {
      imgUrl: "",
      plate_number: "",
      car_detail: {
        serial_number: "",
        plate_type: "",
        china_brand: "",
        model: "",
        car_type: "",
        color: "",
        use_for: "",
        inspection_date: ""
      },
      car_owner: {
        name: "",
        identification_number: "",
        quasi_drive_type: "",
        expire_date: "",
        cumulative_score: "",
        license_status: ""
      },
     }
    },
methods: {
    getetail(){
        this.obj = res.content // $refs.name.getDetail()
    }
},
 beforeUpdate () {
    console.log("before update", this.$data)
  },
  updated () {
    console.log("update", this.$data)
  },
mounted(){
    // setTimeout(() => { 
        // this.getDetail()
        // }, 3000)
    }

clipboard.png

Vue.$set (.), doesn"t work either


this.$nextTick(() => {
        this.$refs.carInfo.getDetail(data)
      })

when was this code called?


getetail(res){//
    this.obj = res.content 
}

the property of obj is not shown due to initialization, such as directly defined by the obj of the fruit component,

data(){
    return{
        obj:{}
    }
}

if you change the obj by calling the method, you will not set the property of the obj to responsive, and the vue cannot detect it. You should give the properties that need to be changed dynamically in advance
data () {

.
    return{
        obj:{
            a:'',
            b:''
        }
    }
}

vue does not detect changes in array or object data,

this.$set(object, key, value) //
this.Array.push({ message: 'Baz' })  // 

document address
ide/list.html-sharp%E6%95%B0%E7%BB%84%E6%9B%B4%E6%96%B0%E6%A3%80%E6%B5%8B" rel=" nofollow noreferrer "> official document


have you solved the same problem now? have you solved


have you solved


image.png may be the problem of key value? don't use timestamp, I'll just change the key value of the parent component to index

.
Menu