我想得到vue的尺寸.来自家长的js组件(我正在使用实验script setup).
当我在组件中使用ref时，它会按预期工作.我得到了尺寸:
// Child.vue
<template>
<div ref="wrapper">
// content ...
</div>
</template>
<script setup>
import { ref, onMounted } from 'vue'
const wrapper = ref(null)
onMounted(() => {
const rect = wrapper.value.getBoundingClientRect()
console.log(rect) // works fine!
})
</script>
但我想得到父组件内部的尺寸.这可能吗？
我试过:
// Parent.vue
<template>
<Child ref="wrapper" />
</template>
<script setup>
import Child from './Child'
import { ref, onMounted } from 'vue'
const wrapper = ref(null)
onMounted(() => {
const rect = wrapper.value.getBoundingClientRect()
console.log(rect) // failed!
})
</script>
控制台会记录此错误消息:
在文档中，我只能找到使用template refs inside the child component的方法
这种方法是否不起作用，因为参考点"默认关闭"为rfcs description says？