vue3.5

最新推荐文章于 2025-09-03 16:51:19 发布

原创最新推荐文章于 2025-09-03 16:51:19 发布 · 315 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript #前端

响应式属性解构

import { watchEffect } from 'vue'
 
const { count } = defineProps(['count'])
 
watchEffect(() => {
  // 每次父组件中的 count 属性变化时都会触发这个日志
  console.log(count)
})

`useTemplateRef` 获取 dom


// MyComposable  封装的方法 获取dom
export const useMyComposable = (options = {templateRef: 'el'})=>{
  // 由于函数名称的缘故，这显然是一个模板引用 👇 
  return useTemplateRef(options.templateRef);
}

<script setup>
const domRef1 = useMyComposable()//回去获取默认的ref
const domRef2 = useMyComposable({ templateRef: 'el2' })
  console.log(domRef2.value)
</script>
<template>
  <div ref="el"></div>
  <div ref="el2"></div>
</template>