본문 바로가기

전체 글62

Vue(version 3) 주요 기능 정리(v-for) #3 vuejs 기능 중 v-for에 대한 기능을 설명합니다.v-for는 반복되는 Element를 구성할 때 자주 사용되는 기능입니다.template>  template v-for="user of UserList" :key="`user-${user.id}`">    div :id="user.id">      {{ user.name }}    div>    span>{{ user.email }}span>  template>template>script setup lang="ts">interface User {  id: string  name: string  email: string}const UserList = reactiveUser[]>([  { id: 'test1', name: '테스트1', email: 't.. 2024. 1. 28.
Vue(version 3) 주요 기능 정리(v-if, v-show) #2 이번에는 v-if와 v-show를 기능을 소개하겠습니다. 코딩을 해본 사람들은 이 기능에 익숙할 것으로 보입니다. 이 기능은 해당 컴포넌트나, Element 를 보이거나 숨길 경우 사용합니다. const isShow = ref(false) let isUserView: boolean = false const ShowElement = (): boolean => { return isShow.value } const CalcUserView = computed((): boolean => { return isUserView }) 위 처럼 조건자, 메소드, 반응형 변수에 사용이 가능합니다. 메소드로 지정되어 있으면, 최초 랜더링 될 때, 한번 체크를 하고, 조건자가 반응형 변수이거나 computed를 사용할 경우 변.. 2024. 1. 26.
[문래동 맛집] 양키통닭 2호점, 양키통닭 예약 웨이팅 후기 문래동 맛집 양키통닭2호점 양키통닭 웨이팅 후기 친구들과 오랜만에 서울 맛집에 다녀왔습니다. 문래동 맛집으로 아주 유명한 양키통닭 저는 주말 일요일 저녁에 방문해서 우선 양키통닭 본점으로 가보았는데요. 오픈시간에 맞춰서 갔는데도 벌써 웨이팅이..😢 그래서 양키통닭 2호점으로 급하게 발걸음을 돌렸죠! 🔺양키통닭 2호점 위치는 위 지도를 참고해주세요 양키통닭 2호점은 양키통닭 본점과 가까워요 2호점도 웨이팅이 있었지만 순서가 두번째라서 기다리기로 했어요. 웨이팅 하면서 양키통닭 메뉴판을 구경했어요. 시금치통닭이 맛있다고 해서 기대가 됐답니다. 많은 분들이 양키통닭 예약 방법 궁금해하시는데요 양키통닭은 따로 예약이 불가하고 가게 앞에 놓인 명단에 이름을 쓰고 기다려야해요. 그리고 입장 순서가 되더라도 일행이 .. 2024. 1. 21.
Vue(version 3) 주요 기능 정리(ref, reactive, computed) #1 Vue의 주요 기능을 정리합니다. Vue는 React와 양대산맥으로 Frontend 기술로 쓰이고 있다. 현재 React가 좀 더 많이 사용하고 있지만, Vue도 꾸준히 사용이 되어 무시 할 수 없는 프레임워크로 성장했다. 아마 jQuery 나, Bootstrap에 익숙한 사람들이 React보다는 친숙한 Vue로 넘어가는게 아닐까 싶다. 그럼 주요 기능을 정리해보고자 한다. 1. 반응형 변수 - 선언한 변수가 Html에 바로 반영되는 변수가 반응형 변수라 한다. - 종류는 ref, reactive, computed 가 있다. - ref : 주로 number, boolean, string, object에 사용된다. 사용법 선언은 위와 같이 하고, 사용은 아래와 같이 Html에 {{ 변수명 }} 으로 표시를.. 2024. 1. 14.
반응형