vue this.$refs 动态拼接

Cimbala

于 2024-07-19 12:07:53 发布

阅读量465

点赞数 1

分类专栏：前端文章标签： vue.js javascript ecmascript

本文链接：https://blog.csdn.net/cimbala/article/details/140545622

版权

前端专栏收录该内容

7 篇文章 0 订阅

订阅专栏

业务需要，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)