如何在 BootstrapVue 轮播中包含图像?

2023-12-23

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

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

I have added Find below images of the result: enter image description here

I am certain the images are correctly saved in the right location: enter image description here


如果使用带有 webpack 的加载器(即 vue-loader、url-loader 等),您需要确保加载器知道img-src接受 URL。

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

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在 BootstrapVue 轮播中包含图像? 的相关文章

  • 在 Vue.js 中从父组件执行子方法

    目前 我有一个 Vue js 组件 其中包含其他组件的列表 我知道使用 vue 的常见方式是将数据传递给孩子 并从孩子向父母发出事件 但是 在这种情况下 我想在子组件中的按钮出现时执行子组件中的方法 parent被点击 哪种方法最好 一种建
  • 如何重置使用 JavaScript 更改的 CSS 属性?

    我的导航按钮的宽度从 100px 增加到 150px 当鼠标悬停在 nav li hover width 150px 但是使用 javascript 我已经做到了 无论选择哪个选项 宽度都将继续为 150px 当选择每个选项时 它会使其他选
  • 使用 useReducers 调度函数发送多个操作?

    使用时是否可以通过调度函数发送多个动作useReducer挂钩反应 我尝试向它传递一组操作 但这会引发未处理的运行时异常 明确地说 通常会有一个初始状态对象和一个减速器 如下所示 const initialState message1 nu
  • 使用模数按字母顺序对列表进行排序

    我在获取元素列表并按字母顺序对它们进行排序方面没有任何问题 但我很难理解如何使用模数来做到这一点 更新 这是按我的方式工作的代码 但是 我更喜欢下面提供的答案的可重用性 因此接受了该答案
  • 如何防止 Iframe 在与浏览器交互后弄乱浏览器的历史记录?

    因此 就我而言 我使用 Iframe 将 Grafana 附加到我的页面 这为我提供了漂亮且易于使用的图表 可以注意到 每次在图表上进行放大或缩小 使用鼠标单击 交互后 Grafana 的 Iframe 都会在我的 Angular 页面上触
  • 可以使用 jQuery 或 Javascript 将图片的特定部分用作链接吗?

    我有这个想法 将图片 而不是文本 的各个部分链接到不同的页面或网站 并且我想在不实际创建不同的照片并将它们彼此靠近的情况下完成 这样看起来就像是一张完整的图片 这里有人知道如何使用 JavaScript 的变体 例如 jQuery 或纯 J
  • 从未用 @flow 标记的导入文件中获取类型定义

    TL DR我怎么告诉flow从未声明的导入模块导入类型定义 flow 加长版 流接缝能够从不使用流语法的文件中派生类型 请参阅示例 示例文件 flow js if Math random lt 0 5 var y hello else va
  • Meteor - 从客户端取消服务器方法

    我正在通过服务器方法执行数据库计数 用户可以选择他们希望如何执行计数 然后调用该方法 我的问题是 计数可能需要一些时间 并且用户可能会在方法运行时改变主意并请求不同的计数 有什么方法可以取消调用的方法并运行新的计数吗 我认为 this un
  • 跟踪用户何时点击浏览器上的后退按钮

    是否可以检测用户何时单击浏览器的后退按钮 我有一个 Ajax 应用程序 如果我可以检测到用户何时单击后退按钮 我可以显示适当的数据 任何使用 PHP JavaScript 的解决方案都是优选的 任何语言的解决方案都可以 只需要我可以翻译成
  • 将div设置为隐藏,延时后可见

    我试图在 X 时间后 也许甚至在随机时间之后 但现在我们只做固定时间 在黑色背景上出现一个黄色方块 function initialSetup if document getElementById yellow null document
  • Babel 7 Jest Core JS“TypeError:wks不是函数”

    将我的项目升级到 Babel 7 后 通过 Jest 运行测试会抛出以下错误 测试在 Babel 6 中运行没有任何问题 但在 Babel 7 中失败并出现以下错误 TypeError wks is not a function at Ob
  • 如何获取 vuejs 组件单元测试中定义的“this”变量

    我正在尝试在 npm 脚本中使用 mocha webpack 来测试 vuejs 组件 我在测试中像这样嘲笑 vuex 商店 const vm new Vue template div div
  • 如何使输入字段和提交按钮变灰

    我想变灰这两件事 http doorsplit heroku com 歌曲输入字段和提交按钮 直到用户输入艺术家 有没有一种简单的方法可以通过 JQuery 来做到这一点 艺术家输入字段的id是 request artist 你可以这样做
  • 如何使用tampermonkey模拟react应用程序中的点击?

    我正在尝试使用 Tampermonkey 脚本模拟对 React 元素的点击 不幸的是 由于 React 有自己的影子 DOM 所以天真的方法使用document querySelector 不工作 我遇到了一些需要修改 React 组件本
  • HTML 离线应用程序缓存,列出下载的文件

    作为我正在构建的离线 Web 应用程序的加载屏幕的一部分 使用缓存清单 http developer apple com library safari documentation iPhone Conceptual SafariJSData
  • Javascript 纪元时间(以天为单位)

    我需要以天为单位的纪元时间 迄今为止 我已经看到过有关如何翻译它的帖子 但几天后就没有了 我对纪元时间很不好 我怎么能得到这个 我需要以天为单位的纪元时间 我将解释为您想要自纪元以来的天数 纪元本身是第 0 天 或第 1 天的开始 无论您如
  • Safari 支持 JavaScript window.onerror 吗?

    我有一个附加到 window onerror 的函数 window onerror function errorMsg url line window alert asdf 这在 firefox chrome 和 IE 中工作正常 但在 s
  • 如何更改此 jquery 插件的时区/时间戳?

    我正在使用这个名为 timeago 的插件 在这里找到 timeago yarp com 它工作得很好 只是它在似乎不同的时区运行 我住在美国东部 费城时区 当我将准确的 EST 时间放入 timeago 插件时 比如 2011 05 28
  • 如何仅在最后一个
  • 处给出透明六边形角度?
  • 我必须制作这样的菜单 替代文本 http shup com Shup 330421 1104422739 My Desktop png http shup com Shup 330421 1104422739 My Desktop png
  • 如何获取浏览器视口中当前显示的内容

    如何获取当前正在显示长文档的哪一部分的指示 例如 如果我的 html 包含 1 000 行 1 2 3 9991000 并且用户位于显示第 500 行的中间附近 那么我想得到 500 n501 n502 或类似的内容 显然 大多数场景都会比

随机推荐

  • 使用 Angular 2 处理 HTML5 事件(onfocus 和 onfocusout)

    我有一个日期字段 我想默认删除占位符 我正在使用 JavaScriptonfocus and onfocusout删除占位符的事件 任何人都可以帮助使用 angular2 指令吗
  • 为什么数组名称后面有括号和点而不是方括号?

    访问数组中的元素时 方括号的使用方式如下 X is an int and Numbers is an int array X Numbers 8 然而 在阅读其他人的代码时 我有时会发现以下语法 PBox SBox1 SBox2 are a
  • std::move 位于移动赋值运算符内

    我读到另一个问题 https stackoverflow com a 5976829 440509在实现移动构造函数时 最好对初始化列表中的每个成员进行 std move 因为如果该成员恰好是另一个对象 则将调用该对象的移动构造函数 就像这
  • HttpWebRequest getRequestStream 在多次运行时挂起

    我编写了一些代码来从侦听器发送和读取文本 这在第一次和第二次交换上运行良好 但在第三次发送时 调用之间有很长的延迟GetRequestStream 以及数据的实际写入 我已经按照此处的建议在发送端处理了输出流 以及流读取器和读取端的输入流
  • 在 R Synth 包中使用 dataprep 函数时出现令人困惑的错误

    我正在尝试使用 R 中的 Synth 包来探索某些政变对发生国家经济增长的影响 但我陷入了一个我无法理解的错误 当我尝试跑步时dataprep 我得到以下信息 Error in dataprep foo World predictors c
  • TypeError:callback.apply 不是allowDiskUse 之后的函数

    我有一个包含 100 万份文档的集合 我已经通过了以下选项allowDiskUse现在它抛出错误 TypeError callback apply is not a function 我已经搜索过这个但可以获得解决方案 请帮助 const
  • 有四个图标的工具栏如何设置像这样?

    有四个图标的工具栏如何设置像这样 我想在工具栏中设置四个类似图像的图标 我有制作工具栏 在 menu main xml 中设置图标 但我没有得到 为什么有人可以帮助我为什么它没有出现 样式 xml
  • 在 python 中使用 get_nowait() 不会引发空异常

    我有一个进程间队列 通常是空的 并且偶尔会出现一些东西 在我的一个线程中 我想定义一个像这样的 while 循环 def mythread queue1 while queue1 get nowait 1 do stuff 这非常有效 直到
  • 删除 T-SQL 文本中的所有注释

    我正在尝试删除所有评论NVARCHAR value 我不知道我会得到哪个值NVARCHAR变量 我需要删除所有以 开头的注释 直到行尾 例如 Some Comments SET NOCOUNT ON Some Comments SELECT
  • 如何在 Php 中将日期增加一天?

    我正在使用这种语法来增加上面的一天 但是当我输入这种格式时 它仍然给我这样的错误日期 01 01 1970 但我想要像 25 08 2016 这样的格式和日期 today 24 08 2016 nextday strftime d m Y
  • 绝对位置和保证金:自动

    我有一个小问题 我希望我的页脚停留在屏幕底部position absolute 但我的margin auto将其放在屏幕中间不再起作用 html
  • 3rd 方库“cordova-plugin-ms-azure-mobile-apps”在我的 Ionic 2 应用程序中未被识别

    在过去两天到处查看 并浏览各种网站上过去的论坛主题 并且没有解决方案之后 我在这里发帖作为最后的手段 我知道每个人都很忙 但这让我很累 我已经尝试了一切可能的方法 从多次从头开始创建应用程序 到一次添加一个库 然后运行并确保它正常工作 然后
  • 使用 MYSQL 数据库数据加载 Javascript 数组

    假设我有一个javascript数组 userName 我想从名为 user 的数据库表加载它 任何人都可以帮忙提供想法或示例代码吗 Thanks 你必须使用mysql connect mysql select db PHP 中的函数连接到
  • 使用 Amazon SQS 的最佳实践 - 轮询队列

    我正在设计一项为我们的电子商务网站发送电子邮件的服务 订单确认 提醒等 计划采用 SendEmail 方法 该方法生成代表要发送的电子邮件的 XML 块 并将其粘贴到 Amazon SQS 队列中 我的网络应用程序和其他应用程序将使用它来
  • Bootstrap 3 - 删除 md 和 lg 之间的断点

    我正在使用 Bootstrap 3 并尝试删除 排除中型和大型设备之间的断点 我有一个现有的网站 已优化为 970 像素 看起来很棒 我想做的是删除 md gt lg 断点 以便即使在大宽屏桌面上 最大主体宽度为 970px 并且仍然居中
  • Eclipse Android项目,如何在工作区中引用库?

    我按照我在这里找到的一些步骤 现在找不到 URL 抱歉 将 Eclipse 中的 Android 项目转换为布局 其中 99 9 的代码位于库项目中 然后我在下面还有另外 2 个 shell 项目相同的工作区 主要只是 AndroidMan
  • 在 Swift 中对 NSDictionary 对象的 NSArray 进行排序

    我已经从 API 检索了一些 JSON 数据 现在有一个充满 NSDictionary 对象的 NSArray 每个 NSDictionary 都有一个 名称 的键 值对 我想按该键 值对对 NSArray 进行排序 我已经做了很多搜索 但
  • 如何从 std::function 获取此指针?

    Since std function可以保存成员函数 因此它必须在某处存储指向对象实例的指针 我怎样才能获取this来自 a 的指针std function拥有成员函数 类型的对象std function持有一个可调用对象 指向成员函数的指
  • 添加额外的圆括号 - 代码无法编译

    所以 我有一个返回布尔值的函数 bool func true do some stuff return true 现在实际代码这样调用 if auto err func true some stuff std cout lt lt std
  • 如何在 BootstrapVue 轮播中包含图像?

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