鍍金池/ 問答/C++  網(wǎng)絡(luò)安全  HTML/ vue 父組件通過ref調(diào)用子組件方法 更新數(shù)據(jù)后，視圖不更新

vue 父組件通過ref調(diào)用子組件方法 更新數(shù)據(jù)后，視圖不更新

vue 父組件通過ref調(diào)用子組件方法 更新數(shù)據(jù)后，視圖部更新

而在子組件mounted(){}里調(diào)用統(tǒng)一方法可以更新

vue版本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()調(diào)用時控制臺數(shù)據(jù)改變但是視圖沒變
    }
},
 beforeUpdate () {
    console.log('before update', this.$data)
  },
  updated () {
    console.log('update', this.$data)
  },
mounted(){
    // setTimeout(() => { 這里調(diào)用可以更新視圖
        // this.getDetail()
        // }, 3000)
    }

clipboard.png

用Vue.$set(...), 也不起作用

回答
編輯回答
萌小萌

obj的屬性沒有顯示的初始化導致的吧如果子組件的obj直接定義的、

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

你通過調(diào)用方法改變obj是不會將obj的屬性設(shè)置成響應(yīng)式的，vue檢測不到，你應(yīng)該預(yù)先給出需要動態(tài)變化的屬性
data(){

    return{
        obj:{
            a:'',
            b:''
        }
    }
}
2017年1月30日 01:21
編輯回答
近義詞

vue不會檢測到 數(shù)組或者對象 數(shù)據(jù)的改變，

this.$set(object, key, value) //對象
this.Array.push({ message: 'Baz' })  // 數(shù)組

文檔地址
官方文檔

2018年2月10日 14:59
編輯回答
敢試
getetail(res){//是不是少了參數(shù)
    this.obj = res.content 
}
2017年9月27日 17:36
編輯回答
離人歸
this.$nextTick(() => {
        this.$refs.carInfo.getDetail(data)
      })

這段代碼，在什么時候被調(diào)用的呢？

2017年6月17日 01:51