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

Vue3学习——标签的ref属性

  1. 在HTML标签上,可以使用相同的ref名称,得到DOM元素
  2. ref放在组件上时,拿到的是组件实例(组件defineExpose暴露谁,ref才可以看到谁)
<script setup lang="ts">
import RefPractice from '@/components/ref_practice.vue'
import {ref} from 'vue'
const practice = ref()
const chackRef = () =>{console.log(practice.value)
}
</script><template><RefPractice ref="practice" @click="chackRef"></RefPractice>
</template>

ref_practice.vue

<script setup lang="ts">
import {ref} from 'vue'const a= ref(1)
const b = ref(2)defineExpose({a}) // 只暴露a,所以父组件拿不到b</script><template><div class="refPractice"><div>ref标签</div></div></template>

在这里插入图片描述

http://www.lryc.cn/news/302986.html

相关文章:

  • 数字化转型导师坚鹏:政府数字化转型之数字化技术
  • go build
  • 力扣238和169
  • Android 基础技术——Framework
  • JavaWeb 中的静态资源访问
  • asp.net web api 用户身份验证
  • 3DTile是不是没有坐标的选择?
  • 数据采集三防平板丨三防平板电脑丨停车场应用
  • 解决git push时的too_many_commits提示
  • GPT-4助力我们突破思维定势
  • 【前端工程化面试题】什么是 CI/CD
  • kafka的安装,用于数据库同步数据
  • Bean 的作用域你知道么 ?
  • Windows 使设置更改立即生效——并行发送广播消息
  • PostgreSQL使用session_exec和file_fdw实现失败次数锁定用户策略
  • Jmeter实现阶梯式线程增加的压测
  • Linux----防火墙之保存规则
  • spring-orm:6 HibernateJpaVendorAdapter源码解析
  • php捕获Fatal error错误与异常处理
  • PyCharm 调试过程中控制台 (Console) 窗口内运行命令 - 实时获取中间状态
  • MacBook Pro如何安装rust编程环境
  • SparkUI任务启动参数介绍(148个参数)
  • nginx 安装
  • 手撕扩散模型(一)| 训练部分——前向扩散,反向预测代码全解析
  • linux 防火墙
  • Go应用性能分析实战
  • MySQL的索引类型
  • picker选择器-年月日选择
  • 【LeetCode-494】目标和(回溯动归)
  • 力扣 188. 买卖股票的最佳时机 IV