将图像与来自作为属性传入的对象的URL绑定-Java 学习之路

我正在使用Vue cli，我将父组件中的对象作为属性传递给子组件 .

这是对象的一个示例（在父组件中但作为prop传递）

{
        question: 'How many times is Jon stabbed when he is murdered at Castle Black?',
        choices: ['1', '6', '9', '10'],
        answer: '6',
        imgUrl: './src/assets/0.jpg'
    }

这是我试图将其绑定到子组件中的图像标记 . questionIndex只是我用来在用户移动到下一个问题时能够呈现下一个问题的数字 .

<img :src="questions[questionIndex].imgUrl"/>

我得到的错误是：GET http://localhost:8080/src/assets/0.jpg 404（未找到）

除了图像，我能够渲染一切 . 我相信它与webpack有关，但我不确定 . 我曾尝试查看类似的线程，但所有人都试图渲染一个已作为数据从vue实例传递的单个图像 . 虽然我的情况不同 .

只是为了让事情更清楚..我正在尝试在Trivia组件中渲染，并且从App组件传入对象（props） .

Directory tree

1 回答

1

动态文件和图像应存储到静态文件夹中，然后引用路径，而根是index.html

./static/images/0.jpg

回复于 2024-05-04T17:13:25+08:00

将图像与来自作为属性传入的对象的URL绑定

1 回答

相关问题