解決vue prop傳值default屬性如何使用,為何不生效的問題
如果在template中,顯示的調用了 prop 屬性,那么 default 屬性就不會生效
如果在template中,不調用 prop 屬性,default 就會生效
default 值有效與否,和 prop 的驗證通不通過,沒有關系
//聲明 Vue.component("blog-post", { props: { postTitle: { type: Number, default: 10000 } }, template: "<h3>{{ postTitle }}</h3>" }); //在template中,顯示調用prop 屬性,default不生效 <blog-post :postTitle="54"></blog-post> //在template中,不調用prop 屬性,default生效 <blog-post></blog-post>
補充知識:vue prop不同數據類型(數組,對象..)設置默認值
vue prop 會接收不同的數據類型,這里列出了 常用的數據類型的設置默認值的寫法,其中包含: Number, String, Boolean, Array, Function, Object
refAge: { type: Number, default: 0 }, refName: { type: String, default: '' }, hotDataLoading: { type: Boolean, default: false }, hotData: { type: Array, default: () => { return [] } }, getParams: { type: Function, default: () => () => {} }, meta: { type: Object, default: () => ({}) }
以上這篇解決vue prop傳值default屬性如何使用,為何不生效的問題就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關文章
keep-Alive搭配vue-router實現(xiàn)緩存頁面效果的示例代碼
這篇文章主要介紹了keep-Alive搭配vue-router實現(xiàn)緩存頁面效果,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-06-06對Vue table 動態(tài)表格td可編輯的方法詳解
今天小編就為大家分享一篇對Vue table 動態(tài)表格td可編輯的方法詳解,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08vue中使用input[type="file"]實現(xiàn)文件上傳功能
這篇文章主要介紹了vue中使用input[type="file"]實現(xiàn)文件上傳功能,實現(xiàn)代碼簡單易懂,非常不錯,具有一定的參考借鑒價值,需要的朋友可以參考下2018-09-09