vue中ref-父主動取值值；

多用月input標簽

定義的時候 直接寫ref=“id”

<el-input 
    placeholder="請輸入內容" 
    style="width: 150px" 
    v-model="id" 
    ref="id" >
</el-input>name:

調用的時候，this.$refs.id.value;

this.id = this.$refs.id.value

父親取兒子或者孫子的值

this.$refs.兒子命子.$refs.孫子名字.取得值

父組件

<div>
    <p> <button @click="add">父BUTTON</button></p>
    父組件：<input type="text" ref="hah">
    <imgs ref="imgs"/>    //引入兒子組件
</div>
//下面重點，默認拉去兒子孫子的參數
add(){
    console.log('父組件'+this.$refs.hah.value)
    console.log('子組件'+this.$refs.imgs.a)
    console.log('孫組件'+this.$refs.imgs.$refs.idx.b)
}

子組件

子組件<input type="text"  v-model="a">
<div>
    <index ref="idx"/>    //子組件引入的子組件
</div>

孫組件

 孫組件:<input type="text" v-model="b">

 

 喜歡的小伙伴可以關注我的微信公眾號“前端偽大叔”