vue3中 ref 获取 dom 元素

最新推荐文章于 2025-03-05 15:18:44 发布

卑微牛马小张

最新推荐文章于 2025-03-05 15:18:44 发布

阅读量826

点赞数 7

文章标签： javascript vue.js 前端

本文链接：https://blog.csdn.net/weixin_58602400/article/details/134814303

版权

本文介绍了如何在Vue3中使用ref组件获取并操作DOM元素，如设置innerText。通过`<template>`展示了一个div元素，`<scriptsetup>`部分展示了如何在mounted生命周期钩子中改变元素内容。

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

vue3中 ref 获取 dom 元素

在 vue3 中使用 ref 可以获取单个 dom 元素，也可以获取遍历的 dom 元素，。。。。。

<template>
        <div ref="box">
            3333333333
        </div>
</template>

<script setup lang="ts">
	let box = ref()
	onMounted(
	    () => {
	        // console.log(box.value)
	        // box.value.style.color = 'red'
	        box.value.innerText = ' 我是innerText插入文本'
	    }
	    )
</script>