2 回答

TA貢獻(xiàn)1829條經(jīng)驗 獲得超4個贊
您不需要this在模板中使用關(guān)鍵字。
<button
type="button"
class="btn btn-warning"
v-on:click="$parent.deleteClicked(name)"
style="margin: 3px;">
{{ name }}
</button >
另外,我建議使用自定義事件來實現(xiàn)您想要做的事情。
<!-- Children component -->
<button
type="button"
class="btn btn-warning"
v-on:click="$emit('delete', name)"
style="margin: 3px;">
{{ name }}
</button >
<!-- Parent component -->
<sablonx
v-for="name in names"
:key="name"
:name="name"
@delete="deleteClicked"/>
您可以看到?jīng)]有參數(shù)被直觀地傳遞給函數(shù)deleteClicked,但實際發(fā)生的是它偵聽delete事件,并將從事件傳遞的數(shù)據(jù)應(yīng)用到函數(shù)。另一種寫法是:
<!-- Parent component -->
<sablonx
v-for="name in names"
:key="name"
:name="name"
@delete="deleteClicked($event)"/>
$event包含要刪除的名稱的變量在哪里。

TA貢獻(xiàn)1744條經(jīng)驗 獲得超4個贊
如果要將數(shù)據(jù)從子組件傳輸?shù)礁附M件,則需要使用 $emit (與將數(shù)據(jù)從父組件傳遞到子組件時不同 - 然后您想要使用道具,或者如果您將數(shù)據(jù)從一個組件傳遞到另一個組件,您可以使用事件總線,這并不總是推薦,但這是另一個主題)
無論如何,代碼是:
this.$emit('youremitname', payload);
每當(dāng)您想發(fā)出數(shù)據(jù)時,您都希望擁有此代碼,例如,如果您想在單擊按鈕后發(fā)出數(shù)據(jù),您希望將其包含在函數(shù)中。(如果您在 @click 屬性中使用它,則不需要“this”關(guān)鍵字,只需編寫:
$emit('youremitname', payload)
這會將數(shù)據(jù)傳輸?shù)礁讣?,但是請確保在使用組件的地方監(jiān)聽它,例如,如果父組件內(nèi)的組件名稱是“客戶”,那么您的代碼應(yīng)如下所示:
<Customers @youremitname></Customers>
您還可以使用以下命令在“已安裝”或“已創(chuàng)建”生命周期掛鉤中偵聽發(fā)射:
$emit.$on('youremitname', passAFunctionHere).
有關(guān)更多信息,請查看 Vue 文檔 -自定義事件。
添加回答
舉報