[vue3] ref로 받은 element가 null일때

 

vue3에서 Composition api 혹은 <script setup>으로 쓸때는 이런식으로 접근할 수 있음

 

<p ref="pp"/>

<script setup>
const pp = ref(null); // 처음에는 null이다가 onMounted이후 element가 자동배정됨
</script>

 

근데 아무리해도 element가 null로 떴고 onMounted 함수 안에서도 바로 찍어봤는데도 null이였음.

 

 

1. 해당 element가 v-if나 v-show로 숨겨져있는지 확인

숨겨져 있다면 dom에 로드되지않기때문에 페이지가 전부 로드되고 나서도 null로 잡혀있게됨.