动态图像绑定提示

Question

我想和这里做相同的事情，但是我想使用images.sample作为参数，例如props：['images.sample']，

<template>
<img :src="images.sample">
</template>

<script>
export default {
    data() {
        return {
            images: {
                sample: require('./assets/static/images/sample.jpg')
            }
        }
    }
}
</script>

Answer 1

您的子组件应类似于：

<template>
<img :src="url">
</template>

<script>
export default {
  name:'child-img',
   props:['url'],
    data() {
        return {

        }
    }
}
</script>

父组件应具有以下内容：

<template>
<child-img :url="images.sample"/>
</template>

<script>
export default {
    data() {
        return {
            images: {
                sample: require('./assets/static/images/sample.jpg')
            }
        }
    }
}
</script>