vue this.$refs 动态拼接

news2024/9/23 6:39:24

业务需要,refs是不固定的

<vxe-grid ref='gridWarehouse' v-bind="gridWarehouseOptions" v-if="tableHeight" :height="tableHeight"
       :expand-config="{iconOpen: 'vxe-icon-square-minus', iconClose: 'vxe-icon-square-plus'}"
        @checkbox-change="gridWarehouseCheckboxChangeEvent" @checkbox-all="gridWarehouseCheckboxAllEvent"
        @toggle-row-expand="toggleExpandChangeEvent">
	<template #deliverDetailList="{ row ,rowIndex }">
		<vxe-table :ref="'tableWarehouse'+ row.deliverOrderCode" border :data="row.recRetDetailVoList"
			       align="center" style="margin-left: 40px" min-height="80"
			       @checkbox-change="tableWarehouseCheckboxChangeEvent"
			       @checkbox-all="tableWarehouseCheckboxAllEvent(row.deliverOrderCode)">
			<vxe-column type="checkbox" width="40"/>
		</vxe-table>
	</template>
</vxe-grid>

动态获取

//静态获取
const $gridWarehouse = this.$refs.gridWarehouse
//动态获取
const $tableWarehouse = this.$refs[`tableWarehouse${deliverOrderCode}`]
console.log($tableWarehouse)

结果打印
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1943035.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

(Qt) 文件读写基础

文章目录 &#x1f5c2;️前言&#x1f4c4;ref&#x1f4c4;访问标记&#x1f5c3;️enum 标记 &#x1f5c2;️Code&#x1f4c4;demo&#x1f4c4;分点讲解&#x1f5c3;️继承体系&#x1f5c3;️打开/关闭&#x1f5c3;️写&#x1f5c3;️读 &#x1f5c2;️END&#x1f…

2024年,人工智能行业哪些证书权威?

人工智能领域颁发的证书有很多&#xff0c;但哪些更权威呢&#xff1f;看颁发证书的单位&#xff01; 工信部电子标准院的人工智能从业人员认证证书是由工业和信息化部电子工业标准化研究院&#xff08;以下简称“电子标准院”&#xff09;颁发&#xff0c;旨在评价和认证人工…

【嵌入式开发之标准I/O】文件I/O的基本概念,打开、关闭、定位函数及实例

文件I/O和标准I/O 什么是文件I/O?什么是标准I/O? 文件I/O&#xff1a;文件I/O又称系统IO&#xff0c;系统调用&#xff0c;称之为不带缓存的IO&#xff08;unbuffered I/O)。是操作系统提供的API接口函数。不带缓存指的是每个read&#xff0c;write都调用内核中的一个系统调…

【HarmonyOS4学习笔记】《HarmonyOS4+NEXT星河版入门到企业级实战教程》课程学习笔记(二十三)

课程地址&#xff1a; 黑马程序员HarmonyOS4NEXT星河版入门到企业级实战教程&#xff0c;一套精通鸿蒙应用开发 &#xff08;本篇笔记对应课程第 33 节&#xff09; P33《32.通知-进度条通知》 下载按钮对应的逻辑&#xff1a; 取消按钮对应的逻辑&#xff1a; 暂停按钮对应的…

Java | Leetcode Java题解之第274题H指数

题目&#xff1a; 题解&#xff1a; class Solution {public int hIndex(int[] citations) {int left0,rightcitations.length;int mid0,cnt0;while(left<right){// 1 防止死循环mid(leftright1)>>1;cnt0;for(int i0;i<citations.length;i){if(citations[i]>mi…

【Django】在anaconda虚拟环境中创建Django项目

文章目录 进入工作目录创建django项目及进入vscode(打开项目目录)选择解析器 进入工作目录 cd C:\WF\developer\djangodemo创建django项目及进入vscode(打开项目目录) django-admin startproject antproject选择解析器 ctrlshiftP打开命令面板

【杰理蓝牙开发】AC695x VM接口原理与使用(1)

本文主要记录 杰理蓝牙VM接口的使用,包括原理的介绍和API接口的使用。 【杰理蓝牙开发】AC695x VM接口原理与使用(1) 0. 个人简介 && 授权须知1. 系统 flash 区域划分1.1 系统区域划分1.2 在配置文件中配置flash区域2. 系统配置项读写接口2.1 读接口:2.2 写接口:2…

MATLAB实验五:MATLAB数据分析

1. 某线路上不同时间对应的电压如下表所示&#xff1a; 1&#xff09;用 3 次多项式拟合(polyfit)该实验曲线&#xff0c;要求绘制 2 原始采样 点&#xff0c;并在 1~8 范围内&#xff0c;使用时间间隔为 0.2 的数据绘制拟合曲线。 建立一个脚本文件&#xff1a;text5_1.m 如下…

【Hot100】LeetCode—279. 完全平方数

目录 题目1- 思路2- 实现⭐完全平方数——题解思路 3- ACM 实现 题目 原题连接&#xff1a;279. 完全平方数 1- 思路 思路 动规五部曲 2- 实现 ⭐完全平方数——题解思路 class Solution {public int numSquares(int n) {// 1. 定义 dpint[] dp new int[n1];//2. 递推公式…

1Panel面板配置java运行环境及网站的详细操作教程

本篇文章主要讲解&#xff0c;通过1Panel面板实现java运行环境&#xff0c;部署网站并加载的详细教程。 日期&#xff1a;2024年7月21日 作者&#xff1a;任聪聪 独立博客&#xff1a;https://rccblogs.com/501.html 一、实际效果 二、详细操作 步骤一、给我的项目进行打包&am…

报考安全工程师,这些人千万别考!

近几年&#xff0c;注安证书的缺口很大&#xff0c;而这两年题目的难度也在逐步增大&#xff0c;考生能越早考越好。但在大环境不好时&#xff0c;很多人都想着增加点副业&#xff0c;因此很多人都会有想学习考证&#xff0c;基本上为了注安挂靠才去考的&#xff0c;有这种念头…

一次搞定!中级软件设计师备考通关秘籍

大家好&#xff0c;我是小欧&#xff01; 今天我们来聊聊软考这个话题。要是你准备参加计算机技术与软件专业技术资格&#xff08;软考&#xff09;&#xff0c;那么这篇文章就是为你量身定做的。话不多说&#xff0c;咱们直接进入正题。 什么是软考&#xff1f; 软考&#xf…

CST热仿真案例——电动车直流快充Cable热仿真

作者 | Zhou Ming 随着大功率直流充电桩的不断普及&#xff0c;我们在享受直流快充带来的高效优势外&#xff0c;更要关注直流快充的安全问题。工程师在设计中必须考虑过压、过流、短路、过温等多重保护机制&#xff0c;才能确保充电过程中的设备和人身安全。本期我们利用CST对…

在浏览器中测试JavaScript代码方法简要介绍

在浏览器中测试JavaScript代码方法简要介绍 在浏览器中测试JavaScript代码是前端开发中的一个重要技能。方法如下&#xff1a; 1. 浏览器控制台 最简单和直接的方法是使用浏览器的开发者工具中的控制台&#xff08;Console&#xff09;。 步骤&#xff1a; 在大多数浏览器…

IT common sense常识

how to input formative json data in console console.log({"message": [{"cat_id": 1,"cat_name": "大家电","cat_pid": 0,"cat_level": 0,"cat_deleted": false,,,,})2) how to clear unecessary c…

软件安全测试知识分享,第三方软件测评中心推荐

在信息技术飞速发展的今天&#xff0c;软件安全测试已经成为确保软件产品质量及用户数据安全的关键环节。 安全测试的核心是识别、评估和降低软件系统中潜在的安全风险。通过深度剖析软件架构、代码及其使用环境&#xff0c;测试人员能够找出可能被黑客攻击的薄弱环节。所谓“…

QSqlRelationalTableModel 增删改查

QSqlRelationalTableModel 可以作为关系数据表的模型类&#xff0c;适用于三范式设计的表&#xff0c;主表中自动加载外键表中的名称。本文实现QSqlRelationalTableModel 为模型类&#xff0c;实现增删改查。 目录 0.表准备 1. 构建表格数据 声明变量 表格、数据模型、选择…

5G赋能新能源,工业5G路由器实现充电桩远程高效管理

随着5G技术的广泛应用&#xff0c;新能源充电桩的5G应用正逐步构建起全新的生态系统。在数字化转型的浪潮中&#xff0c;新能源充电桩行业正迎来数字化改革。工业5G路由器的引入&#xff0c;为充电桩的远程管理提供了强有力的技术支持&#xff0c;新能源充电桩5G路由器网络部署…

Linux系统编程__进程学习1

文章目录 进程相关概念进程创建实战fork函数创建进程vfork创建进程子进程退出等待子进程孤儿进程 进程相关概念 一、什么是程序&#xff0c;什么是进程&#xff0c;有什么区别&#xff1f; 程序是静态的概念&#xff0c;gcc xxx.c –o pro 磁盘中生成pro文件&#xff0c;叫做程…

基于vue3 + vite产生的 TypeError: Failed to fetch dynamically imported module

具体参考这篇衔接&#xff1a; Vue3报错&#xff1a;Failed to fetch dynamically imported module-CSDN博客 反正挺扯淡的&#xff0c;错误来源于基于ry-vue-plus来进行二次开发的时候遇到的问题。 错误起因 我创建了一个广告管理页面。然后发现访问一直在加载中。报的是这样…