一、Vue$attrs是什麼
Vue$attrs是Vue.js提供的一個屬性，它包含了父組件中非prop屬性的集合對象。這個屬性為我們提供了一個方便的方式來擴展子組件的props選項。與之對應的是Vue$listeners，該屬性可以監聽子組件的所有事件並將它們綁定到根元素上。
二、Vue$attrs的作用
很多情況下，我們在編寫組件的時候需要定義大量的props屬性。但是，有時候我們不得不將某些屬性傳遞到自定義組件中，即使這些屬性在組件內部並未使用。這就會使得我們需要處理大量的props語句，這樣會加大代碼的複雜度。那麼Vue$attrs則提供了一種極為方便的方式來解決這個問題，它會將父組件中非prop的屬性作為組件的attrs對象傳遞給子組件，並且這個對象中的屬性都會自動行式轉換為字符串鍵。
三、Vue$attrs的使用方式
Vue$attrs的使用方式非常簡單，只需要在子組件中添加一個接收attrs參數的props即可實現其實用。示例如下：
Vue.component('comp', {
props: ['propA', 'propB', 'propC'],
template: `{{ propA }}
{{ propB }}
{{ propC }}
- {{ name }}: {{ value }}
原創文章，作者：小藍，如若轉載，請註明出處：https://www.506064.com/zh-hk/n/182964.html
微信掃一掃 
支付寶掃一掃 