Vue props中Object和Array設(shè)置默認(rèn)值操作
我就廢話不多說(shuō),看代碼吧~
seller: { type: Object, default() { return {} }}
seller: { type: Object, default: function () { return {} }}
當(dāng)父組件沒(méi)有傳這個(gè)值或者值是空時(shí),輸出的話,返回:
下面這種是錯(cuò)誤的
seller: { type: Object, default: () => {}}
當(dāng)父組件沒(méi)有傳這個(gè)值或者值是空時(shí),輸出的話,這時(shí)是返回underfind,在template中獲取里面的值時(shí),就報(bào)錯(cuò)。
補(bǔ)充知識(shí):解決vue props 默認(rèn)值為數(shù)組或?qū)ο髸r(shí)報(bào)錯(cuò)的問(wèn)題
簡(jiǎn)單粗暴直接上代碼:
// 這些寫(xiě)時(shí)會(huì)報(bào)錯(cuò) Type of the default value for ’record’ prop must be a function props: { record: { type: Array, default: [] } } // 正確應(yīng)該這樣寫(xiě)// 因?yàn)関ue規(guī)定,對(duì)象或數(shù)組默認(rèn)值必須從一個(gè)工廠函數(shù)獲取 props: { record: { type: Array, default: function () { return [] } }}
以上這篇Vue props中Object和Array設(shè)置默認(rèn)值操作就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
1. 詳解Android studio 動(dòng)態(tài)fragment的用法2. 解決Android studio xml界面無(wú)法預(yù)覽問(wèn)題3. 圖文詳解vue中proto文件的函數(shù)調(diào)用4. Spring Boot和Thymeleaf整合結(jié)合JPA實(shí)現(xiàn)分頁(yè)效果(實(shí)例代碼)5. php模擬實(shí)現(xiàn)斗地主發(fā)牌6. 什么是python的自省7. Vue封裝一個(gè)TodoList的案例與瀏覽器本地緩存的應(yīng)用實(shí)現(xiàn)8. vue 使用localstorage實(shí)現(xiàn)面包屑的操作9. .Net Core使用Coravel實(shí)現(xiàn)任務(wù)調(diào)度的完整步驟10. Vuex localStorage的具體使用

網(wǎng)公網(wǎng)安備