VUE7 vue 라이프 사이클에 대하여 beforeCreate 인스턴스가 생성되고 나서 가장 처음으로 실행되는 라이프 사이클 단계입니다. 이 단계에서는 data 속성과 methods 속성이 아직 인스턴스에 정의되어 있지 않고, 돔과 같은 화면 요소에도 접근할 수 없습니다. created beforeCreate 라이프 사이클 단계 다음에 실행되는 단계입니다. data 속성과 methods 속성이 정의되었기 때문에 this.data 또는 this.fetchData()와 같은 로직들을 이용하여 data 속성과 methods 속성에 정의된 값에 접근하여 로직을 실행할 수 있습니다. 다만, 아직 인스턴스가 화면 요소에 부착되기 전이기 때문에 template 속성에 정의된 돔 요소로 접근할 수 없습니다. 그리고 data 속성과 methods 속성에 접근.. 2024. 1. 14. VUE 로그인 input validation id, password만 입력하는 간단한 로그인 화면을 vue에서는 어떻게 validation 하는지 확인해봅시다. 우선 테스트 코드 html 입니다. userId, passwd 라는 input 과 로그인 button 이 있습니다. id없음 적어도4자리 패스워드없음 자릿수체크 로그인 보통 jsp에서 사용하는 input에서는 name이나 id 속성을 사용하여 해당 input을 컨트롤 하는데 vue에서는 v-model 이라는 속성으로 input 을 컨트롤 합니다. 앞에 v- 가 붙으면 vue에서 사용하는 속성인 것 같습니다. v-show는 true면 해당 element를 보여주고 false면 보여주지 않는다고 합니다. v-show="userIdNo" 라는 것은 userIdNo 가 true이면 "id없음" 이.. 2024. 1. 6. VUE에 대해서 프론트, 백엔드가 나뉘기 시작한 시점으로부터 한참 뒤, VUE라는게 나왔다. react가 대세로 떠오르긴 했지만 JavaScript에 취약한 나는 react의 material을 따라가기 어려워 회피하고야 만다. 그 와중에 떠오른 VUE는 그나마 react보다는 접근이 쉬워 보였으나... 실제로 접한 VUE는 생각보다 쉽진 않았고 모르는 것 투성이고 프론트에 취약하기 때문에 VUE에 대해서는 공부해야겠다고 생각했다. 그러나 실천이 어렵고... 어렵다. 그래서 VUE란 무엇인지, 공식 문서에 있는 내용을 한번 읽어보기로 하자. 참고로 현재는 VUE 3 가 나온 상태이다. Vue( view 와 마찬가지로 /vjuː/ 라고 발음합니다 )는 사용자 인터페이스를 구축하기 위한 JavaScript 프레임워크입니다. .. 2023. 12. 30. 이전 1 2 다음
