vue 子元件觸發父元件方法的兩種方式

如下：通過this.emi

t()來

觸發父組

件的方法

。具體就

是子元件

觸發

emit()來觸發父元件的方法。具體就是子元件觸發

emit()

來觸發父

元件的方

法。具體

就是子組

件觸發emit繫結的事件watchchild，然後父元件監聽watchchild，一旦watchchild被觸發便會觸發父元件的parentreceive方法。

父元件：

"openchild"
>彈彈彈，彈出子元件<
/div>
"alert" @watchchild=
"parentreceive"
>
<
/childs>
<
!--監聽子元件繫結的方法--
>
<
/div>
<
/template>
import childs from
'../components/modal/alert'
export
default},
components:
, methods:
,openchild()
}}<
/script>
<
/style>

'show' ref=
"modal"
>
"title"
>
}<
/div>
"content"
>
}<
/div>
"buttons"
class
="modal-buttons"
>
="modal-button" @click=
"_onclick()"
>確定<
/span>
<
/div>
<
/modal>
<
/template>
import modal from
'./modal'
export
default
, oktext:,}
,data()
},components:
, methods:
,close()
,_onclick()
}}<
/script>

父元件：

"openchild"
>彈彈彈，彈出子元件<
/div>
"alert"
:on-ok=
"parentreceive"
>
<
/childs>
<
!--把父元件的方法名傳給子元件的onok屬性--
>
<
/div>
<
/template>
import childs from
'../components/modal/alert'
export
default},
components:
, methods:
,openchild()
}}<
/script>
<
/style>

'show' ref=
"modal"
>
"title"
>
}<
/div>
"content"
>
}<
/div>
"buttons"
class
="modal-buttons"
>
="modal-button" @click=
"_onclick()"
>確定<
/span>
<
/div>
<
/modal>
<
/template>
import modal from
'./modal'
export
default
, oktext:
, onok:},
data()
},components:
, methods:
,close()
,_onclick()
}}}<
/script>

vue父元件觸發子元件方法

通常來說是子元件觸發父元件的情況比較多。比如每次提交表單的時候封裝了常用的選項類子元件，選好值之後將值傳回父元件，父元件得到值這樣的操作。這是不用初始化頁面資料的情況。但是還有其他的情況就是已經選好了謀個服裝的品牌和品牌下的某個系列後 這是兩個相同的元件但是在父元件不同的地方呼叫 這時候我想換個品牌...

Vue 父元件如何觸發子元件中的方法

子元件 child 父元件 點選 1.首先父元件匯入子元件並且在components中定義子元件 2.引用子元件，並定義ref，用於 this.refs.mychild 呼叫 3.呼叫子元件的方法 parenthandleclick 為子元件的方法 注 在呼叫子元件的方法時 this.refs.my...

vue子元件呼叫父元件方法

說明 有乙個元件inputlistselect.vue，選中乙個行資料，將該資料傳送到父級projectedit.vue檔案中 1 父級projectedit.vue呼叫 import inputlistselect from views components inputlistselect exp...