javascript - 如何在BootstrapVue轮播中添加图片？(How do I include image in BootstrapVue carousel?)

Question

I am trying to add an image to the img-src="" attribute of b-carousel in BoostrapVue.

(我正在尝试将图像添加到BoostrapVue中b-carousel的img-src =“”属性中。)

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:

(我确定图像已正确保存在正确的位置：)

  ask by Iamlimo translate from so

Answer 1

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

(如果将加载程序与webpack一起使用（即vue-loader，url-loader等），则需要确保该加载程序知道img-src接受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 )

(请参阅有关如何告诉加载程序处理自定义组件上的URL道具的信息的文档： https : //bootstrap-vue.js.org/docs/reference/images （特别是Vue Loader transformAssetUrls ）)