成分
props: {
image: {
type: String,
default() {
return this.defaultImage
}
}
},
computed: {
defaultImage() {
return this.$config.baseUrl '/images/default.jpg'
}
},
使用上述組件，當 prop-image 不存在時，組件成功回傳 default-image。
<image-uplaoder />
但是我想實作，如果我傳遞prop-image的值并且值為null，它仍然應該回傳default-image。目前，它什么都不回傳。
<image-uplaoder :image="data.image" />
嘗試（我們不能做類似的事情）如下？
computed: {
defaultImage(value) {
if(!value || value === null) {
return this.$config.baseUrl '/images/default.jpg'
}
}
},
uj5u.com熱心網友回復：
default()計算屬性應該包含使用默認值的邏輯，而不是 prop 的選項：
// ImageUploader.vue
export default {
props: {
image: String,
},
computed: {
imgUrl() {
return this.image || (this.$config.baseUrl '/images/default.jpg')
}
}
}
然后將計算屬性系結到您的<img>.src：
<img :src="imgUrl">
演示
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/332935.html