原文地址: http://www.php.cn/js-tutorial-410304.html

本篇文章给大家带来的内容是关于vue $refs中不使用拼接的原因以及解决方法,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

<li class="audio-item media" v-if="item.type == 3" @click="handleClearInterval(item.id)">
<xm-audio :audioSrc="item.content" :size="item.size" :ref="'audio'+index"></xm-audio>
</li>
handleClearInterval(id) {
_.each(this.$refs,(item,key)=>{
if(key != 'audio'+index){
console.log(this.$refs);
console.log(this.$refs.audio[key])
}
})
},

这样写就会报错

换一种写法,去掉audio

改成console.log(this.$refs[key])
这样依旧不行

官方是这样描述的

改成如下形式

<li class="audio-item media" v-if="item.type == 3" @click="handleClearInterval(item.id)">
<xm-audio :audioSrc="item.content" :size="item.size" ref="audio"></xm-audio>
</li> handleClearInterval(id) {
const audioList = this.filterListByType(this.info.instHomeworkContents,)
_.each(audioList,(item,key)=>{
if(item.id != id) {
console.log(this.$refs)
console.log(this.$refs.audio[key]);
this.$refs.audio[key].clearInterval()
}
})
},

这样就能获取到想要的那个dom,我这里是获取了,循环出的子组件,以上就是vue $refs中不使用拼接的原因以及解决方法.

vue $refs 无法动态拼接,获取不到对象(转)的更多相关文章

  1. Expression表达式目录树动态拼接 反射获取泛型方法

    class TestOne { public String[] arr = { "1", "2", "3" }; public class ...

  2. mysql 动态拼接表字段,值 mybatis 动态获取表字段

    -- 取表所有字段,自动用逗号分开 select GROUP_CONCAT(DISTINCT COLUMN_NAME) from information_schema.columns where ta ...

  3. 初识Mybatis框架,实现增删改查等操作(动态拼接和动态修改)

    此第一次接触Mybatis框架确实是有点不适应,特别是刚从Hibernate框架转转型过来,那么为什么要使用Mybatis框架,Mybatis框架和Hibernate框架又有什么异同呢? 这个问题在我 ...

  4. 分享动态拼接Expression表达式组件及原理

    前言 LINQ大家都知道,用起来也还不错,但有一个问题,当你用Linq进行搜索的时候,你是这样写的 var query = from user in db.Set<User>()      ...

  5. java动态拼接sql语句并且执行时给sql语句的参数赋值

    问题 在这里举一个例子,比如我要做一个多条件模糊查询,用户输入的时候有可能输入一个条件,也有可能输入两个条件,这时执行查询的sql语句就不确定了,但可以用动态拼接sql语句来解决这个问题. 解决方法 ...

  6. mybatis 使用记录(二) 动态拼接查询条件

    2016-12-16 阅读项目代码时,在项目的xml文件中发现如下写法: SELECT student_user_id FROM tbr_student_class WHERE 1=1 <if ...

  7. Lambda表达式动态拼接(备忘)

    EntityFramework动态组合Lambda表达式作为数据筛选条件,代替拼接SQL语句 分类: C# Lambda/Linq Entity Framework 2013-05-24 06:58 ...

  8. 动态拼接 sql的时候 里面 如果有变量的话 按上面的方式进行处理

    set @Sql_Sql = N' select top 1 @m_zw=zw,@m_zh=temp from ket where zd=''ddd'' ' print @Sql_Sql EXEC s ...

  9. EF 拉姆达 动态拼接查询语句

    EF 动态拼接查询语句 using System; using System.Collections.Generic; using System.IO; using System.Linq; usin ...

随机推荐

  1. bash内建命令

    bash内建命令 1.local命令 基本介绍 local命令是用来定义一个局部变量的,它只能定义在函数中,并且随着函数的结束而被销毁 基本语法 local  [option]  name[=valu ...

  2. springboot+mybatis-puls利用swagger构建api文档

    项目开发常采用前后端分离的方式.前后端通过API进行交互,在Swagger UI中,前后端人员能够直观预览并且测试API,方便前后端人员同步开发. 在SpringBoot中集成swagger,步骤如下 ...

  3. java项目---用java重命名文件(1星)

    package Demo; import java.io.File; public class FileRename { public static boolean Rename(String old ...

  4. Java Web 学习笔记 1

    Java Web 学习笔记 1 一.Web开发基础 1-1 Java Web 应用开发概述 1.1.1 C/S C/S(Client/Server)服务器通常采用高性能的PC机或工作站,并采用大型数据 ...

  5. eclipse运行无错的ssm项目,迁移到idea出错

    我的报错信息为mapper绑定相关错误,是因为idea在构建项目时,target/classes目录下不存在mapper.xml文件 解决方法: <!-- 在maven中添加以下配置,它的父标签 ...

  6. 疯狂java讲义 第八章课后题

    1.创建一个Set集合,并用Set集合保存用户通过控制台输入的字符串. import java.util.HashSet; import java.util.Scanner; public class ...

  7. hello1 hello2 服务器安装加部署全过程

    1.安装maven和glassfish及配置环境变 首先搜索并下载maven3.6.0和glassfish4.1.1(版本看按需要选择). 点击安装包进行安装 安装完成后开始配置环境变量 打开系统环境 ...

  8. node环境下express路由,

    1.基本路由概念 路由是指确定应用程序如何响应对特定端点的客户端请求,该请求是URI(或路径)和特定HTTP请求方法(GET,POST等). 每个路由都可以有一个或多个处理函数,这些函数在路由匹配时执 ...

  9. node连接mongodb(简略版)

    1.先通过配置启动mongodb,然后新建db.js     已经对相对应的数据库操作增删改查封装完成. //这个模块里面封装了所有对数据库的常用操作 var MongoClient = requir ...

  10. 迭代器使用【阿里JAVA开发手册】

    调用迭代器的remove的方法(它的方法实现是:调用ArrayList的remove(index)方法 ) 然后游标cursor相应的进行减1操作