当前位置: 首页 > news >正文

vue3如何批量设置动态ref

示例如下:

<template v-for="item in selectList"><el-select v-model="item.value" :ref="el => setRef(el, item)"><el-optionv-for="v in item.options":key="v.value":label="v.label":value="v.value"/></el-select></template>
const state = reactive({selectList:[{ key:'aaa', value:'', options:[{ label:'测试', value:'1' }]},{ key:'bbb', value:'', options:[{ label:'测试', value:'1' }]} ]
})
const { selectList } = toRefs(state)
const selectRef = ref({}) as any;//动态设置ref
const setRef= (el, item) => {if (el) {selectRef.value[item.key] = el}
}console.log(selectRef.value['aaa'])
// 打印出来的值为 动态绑定的选择框aaa的ref属性
http://www.lryc.cn/news/133292.html

相关文章:

  • Android Studio run app 设置 release 模式
  • 【SA8295P 源码分析】41 - SA8295所有镜像位置、拷贝脚本、生成QFIL包
  • 【Redis】Redisson分布式锁原理与使用
  • Segment Anything论文阅读笔记
  • Python入门教程 | Python 基础语法
  • JAMstack架构:快速构建安全、高性能的现代应用
  • Web会话技术
  • hbuilderx打包苹果证书获取步骤
  • JAVA下载Excel文件之后无法打开,提示损坏
  • 复合 类型
  • Practices11|41. 缺失的第一个正数(数组)、73. 矩阵置零(矩阵)
  • 深入完整的带你了解java对象的比较
  • ubuntu20.04升级GLIBC高版本方法,解决:version `GLIBC_2.34‘ not found
  • 日产将使用东风纯电平台?官方回应:不是日产品牌
  • cdh6.3.2 Flink On Yarn taskmanager任务分配倾斜问题的解决办法
  • 改进YOLO系列:3.添加SOCA注意力机制
  • SpringBoot整合Mybatis Plus——条件构造器Wrapper
  • while循环语句
  • 【ARM 嵌入式 编译系列 11 -- GCC __attribute__((packed))详细介绍】
  • Pytorch-day06-复杂模型构建-checkpoint
  • windows电脑系统自带的画图工具如何实现自由拼图
  • 直线模组的运行注意事项
  • 记录每日LeetCode 2236. 判断根结点是否等于子结点之和 Java实现
  • 使用PHP生成MySQL数据字典
  • React(7)
  • MySQL8.0新特性之用户管理
  • 强推9个研究生必备的免费论文下载网站
  • 解读2023年上半年财报:继续押注儿童业务的361°,有着怎样的野心?
  • 音视频 ffplay播放控制
  • 扁线电机定子转子工艺及自动化装备