2 回答

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

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