如何在BootstrapVue轮播中添加图片? [英] How do I include image in BootstrapVue carousel?

问题描述

我正在尝试将图像添加到BoostrapVue中b-carousel的 img-src =" 属性中.该图像当前保存在资产文件夹中.

I am trying to add an image to the img-src="" attribute of b-carousel in BoostrapVue. The image is currently saved in the asset folder.

  <b-carousel-slide img-src="../assets/life.jpg">
        <h1>Hello world!</h1>
      </b-carousel-slide>

我添加了查找以下结果图:

I have added Find below images of the result:

我确定图像已正确保存在正确的位置:

I am certain the images are correctly saved in the right location:

推荐答案

如果通过Webpack使用加载程序(即vue-loader，url-loader等)，则需要确保该加载程序知道 img-src 接受URL.

If using a loader with webpack (i.e. vue-loader, url-loader, etc), you need to ensure that the loader knows that img-src accepts a URL.

请参阅有关如何告诉加载程序处理自定义组件上的URL道具的信息的文档:

See the docs on information on how to tell the loaders to handle URL props on custom components: https://bootstrap-vue.js.org/docs/reference/images (specifically Vue Loader transformAssetUrls)

这篇关于如何在BootstrapVue轮播中添加图片?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！