Javascript 如何使用父组件内的计算属性更改子组件道具？

我在从父组件更新props use computed属性时遇到问题

下面是来自子组件的脚本

var bgChild = {
  name: 'bg-image',
  props: {
    bgBoolean: {
     type: Boolean,
     required: true,
    },
    mb: {
     type: String,
     default: '../images/images.png'
    },
    dp: {
     type: String,
     default: '../images/imagesDp.png'
    }
  }
}

const bgParent = Vue.extend {
  template: '#parent',
  components: {
    'bg-child': bgChild
  },
}

在我的父组件中

var bgChild = {
  name: 'bg-image',
  props: {
    bgBoolean: {
     type: Boolean,
     required: true,
    },
    mb: {
     type: String,
     default: '../images/images.png'
    },
    dp: {
     type: String,
     default: '../images/imagesDp.png'
    }
  }
}

const bgParent = Vue.extend {
  template: '#parent',
  components: {
    'bg-child': bgChild
  },
}

在父标记的内部

<template id="parent">
  <div class="parent-div>
    <bg-child :src="bg-boolean ? md : dp"></bg-child>
  </div>
</template>

父标记
-这是否有效？是的，它在
mb
道具上显示图像，因为默认设置为
true
，那么
md
是什么？正如您所见，
md
是来自childComponent的道具，它将图像链接为默认属性，这很糟糕，它应该是
mb
而不是
md
父标记
-它甚至可以工作吗？是的，它可以在
mb
道具上显示图像，因为默认设置为
true
那么，您可以看到
md
是什么，
md
是childComponent的道具，它将图像链接为默认属性很糟糕，它应该是
mb
而不是
md