vue 使用render函数动态生成ref标识

最新推荐文章于 2025-03-20 02:50:29 发布

一两风@

最新推荐文章于 2025-03-20 02:50:29 发布

阅读量1.7k

点赞数 1

本文链接：https://blog.youkuaiyun.com/WANG_AFei/article/details/102742183

版权

本文介绍在Vue中如何使用createElement动态生成ref，并在数据动态生成时确保调用ref下方法的有效性。通过设置refInFor为true，可以生成ref数组，从而在组件中成功调用如focus等方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

// 使用vue 中的render中的createElement函数动态生成ref
// 问题：动态生成数据时 ref 存在 但是调用ref下的方法不生效

// 由于数据动态生成 肯定与 v-for 同时使用了
createElement("input", {
	props: { },
	// 事件
	on: { },
	// 事件
	nativeOn: {
		keyup: function (e) {
			console.log(e.keyCode)
		}
	},
	ref: 'ref',
	// 与v-for 同时使用在此处添加refInFor生成一个ref数组
	refInFor: true
})
在组件中使用 this.$ref.ref[0].focus()  // 调用成功