Vue.js - 如何获取 v-for 子组件中的最后一个子引用

2024-04-29

我想在页面加载后播放最新的音频:

<player ref="player" v-for="item in data"><player>

我怎样才能做这样的事情:

vm.$refs.player.last().play();


创建新的 prop,如果该 item 是最后一个,则传递 true。

<player ref="player" v-for="(item, index) in data" :should-play="index === data.length - 1">

<player>

播放器组件:

props {
   shouldPlay: Boolean
}

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

Vue.js - 如何获取 v-for 子组件中的最后一个子引用 的相关文章

  • 缩小 ASP.NET 生成的 Javascript 的最佳方法是什么?

    在 ASP NET 3 5 运行时缩小 ASP NET 生成的 Javascript 例如由 webresource axd 提供的 Javascript 的最佳方法是什么 我尝试使用Mb压缩 http mbcompression code
  • 使用通过 (document.getElementById('ID')) 添加到数组的元素

    为什么这段代码不起作用 var all obj element new Array all obj element 0 document getElementById Img3 alert all obj element 0 style w
  • JavaScript 原型继承和 html canvas

    我是一名 Ruby 开发人员 最终决定认真学习 JavaScript 所以我买了一些书 开始深入研究 但当我试图理解原型继承时 我很快就陷入了困境 这本书的例子之一如下 给定一个 Shape 其原型有一个绘制方法 以及两个子形状 一个 Tr
  • 从 Eclipse 导出后,WAR 文件中缺少一些必要的库 - 为什么?

    我接手了一个大学的项目 其中包含一些 Web 服务 通过将项目导出为 WAR 文件 一些库包含在文件中 例如 Axis2 而另一些则不包含 hibernate JDBC 驱动程序 另外 添加到类路径中的 jar 尚未导出 所有库都位于硬盘驱
  • 始终滚动 div 元素而不是页面本身

    我有一个带有内部的页面布局 div 包含页面上重要内容的元素 设计的重要部分是 content height 300px width 500px overflow scroll 现在 当包含的文本大于 300px 时 我需要能够滚动它 是否
  • 如何设置黄瓜环境变量

    我有以下 package json name newcucumber version 1 0 0 main index js scripts test node modules bin cucumber js firefox node mo
  • 确定用户是否在shadow dom之外单击

    我正在尝试实现一个下拉菜单 您可以单击外部将其关闭 下拉列表是自定义日期输入的一部分 并且封装在输入的影子 DOM 内 我想写一些类似的东西 window addEventListener mousedown function evt if
  • 如何在没有数据库的情况下创建AJAX分页?

    是否可以在没有 MySQL 帮助的情况下获取 AJAX 分页页面 难道我不能只添加一个包含我需要显示的文本和标记的 PHP 文件 然后通过单击页码将该内容提供给用户吗 那么可以用纯 jQuery 和 PHP 来实现吗 您会使用什么代码方法来
  • Bootstrap shown.bs.tab 事件不起作用

    我正在使用灵活的模板 http the8guild com themes html flexy v1 7 stylesPage html 使用引导程序 并且我无法让选项卡上的 shown bs tab 事件正常工作 我已经成功让它发挥作用J
  • 可拖动的非模态弹出窗口 Jquery Mobile

    我希望在 Jquery mobile 中有一个弹出窗口 它不会阻止用户与页面交互 并且 data dismissible false 即当页面的另一部分与页面的另一部分交互并保持可见时 弹出窗口不会消失 我已经尝试过这个 popupNew
  • 如何在 Angular2 中为表单分配和验证数组

    我的模型 this profile 在 javascript 中有一个属性叫做emails 这是一个数组 email isDefault status 然后我将其定义如下 this profileForm this formBuilder
  • 如何使用 Selenium webdriver 测试对 SVG 对象的点击?

    我正在尝试编写代码来检查单击 SVG 对象的功能 例如此 URL 上的美国州 http www amcharts com svg maps map usa 这可行 但是有更好的方法吗 不需要物理移动鼠标的东西 robert new Robo
  • 如何在正则表达式中区分数字和ip地址?

    例如 如果我们查看 5 56 和 183 55 0 144 基本上 当你做这样的事情时 d d 它匹配 5 56 189 55 和 0 144 有没有办法通过正则表达式仅匹配数字而不匹配 ip 地址的部分 我尝试使用前瞻 但我不知道它应该是
  • 如何使用 Eclipse 作为 Javascript IDE?

    我从官方下载页面下载了 eclipse Javascript IDE 但是 当我启动应用程序时 它显示 必须提供 Java 运行时环境或 Java 开发工具包才能运行 eclipse 我已经有一个运行良好的 eclipse 的 java I
  • 从数据库中给定时间起经过的时间

    我有一个 HTML 表 其中包含从数据库中提取的记录 我正在使用 PHP MySQL 我的表中名为 Timer 的列未从数据库中检索 我需要在此处显示经过的时间 从数据库中的特定时间开始 例如 假设现在的时间是2013年2月21日下午6点2
  • 字符串化 JavaScript 对象

    我正在寻找字符串化一个对象 我想要这样的输出 1 valeur dalebrun usager experttasp date 2013 08 20 16 41 50 2 valeur test usager experttasp date
  • Nuxt + Vuex - 如何将 Vuex 模块分解为单独的文件?

    在 Nuxt 文档中 here https nuxtjs org guide vuex store module files 它说 您可以选择将模块文件分解为单独的文件 state js actions js mutations js an
  • 使用 Lodash 循环 JavaScript 对象中的属性

    是否可以循环访问 JavaScript 对象中的属性 例如 我有一个 JavaScript 对象定义如下 myObject options property1 value 1 property2 value 2 属性将动态添加到该对象 有没
  • 如何在javascript中删除对象的一部分

    这是我的代码 var data btn click function total data push id total cell val1 val2 val3 每次用户点击btn按钮 我向数据对象添加一些值 现在我的问题是如何删除有的部分i
  • 为什么 JavaScript 默认导出不可用?

    为什么默认导出不像命名导出那样实时 lib js export let counter 0 export function incCounter counter export default counter main1 js import

随机推荐