https://github.com/esthel7/vue.js/pull/13

반응형 구현 중, 특정 이벤트 발생 시 원하는 dom의 스타일을 변경해야했다.

ref를 사용해서 true면 속성이 적용되도록 하였다.

<template>
  <div
    class="basic"
    @click="open('basic')"
    :style="{ display: BasicView ? 'block' : 'none' }"
  >
    ...code
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';

const BasicView = ref(false);
const TopNav = 1120;

const open = (className: string) => {
  if (window.innerWidth > TopNav) return;

  if (className === 'basic') {
    BasicView.value = !BasicView.value;
    // ref값 변경
  }
};
</script>