您好,登錄后才能下訂單哦!
這篇文章給大家分享的是有關vue如何實現屬性事件傳遞的內容。小編覺得挺實用的,因此分享給大家做個參考,一起跟隨小編過來看看吧。
屬性事件傳遞
寫過高階組件的童鞋可能都會碰到過將加工過的屬性向下傳遞的情況,如果碰到屬性較多時,需要一個個去傳遞,非常不友好并且費時,有沒有一次性傳遞的呢(比如react里面的{...this.props})?答案就是v-bind和v-on。
舉個例子,假如有一個基礎組件BaseList,只有基礎的列表展示功能,現在我們想在這基礎上增加排序功能,這個時候我們就可以創建一個高階組件SortList。
<!-- SortList --> <template> <BaseList v-bind="$props" v-on="$listeners"> <!-- ... --> </BaseList> </template> <script> import BaseList from "./BaseList"; // 包含了基礎的屬性定義 import BaseListMixin from "./BaseListMixin"; // 封裝了排序的邏輯 import sort from "./sort.js"; export default { props: BaseListMixin.props, components: { BaseList } }; </script>
可以看到傳遞屬性和事件的方便性,而不用一個個去傳遞
感謝各位的閱讀!關于“vue如何實現屬性事件傳遞”這篇文章就分享到這里了,希望以上內容可以對大家有一定的幫助,讓大家可以學到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。