분류 전체보기

[vue.js] vuex, constants, mixins 사용하여 만들어보는 회원가입 1탄(ver.2022)
서론 지난번에 썼던 https://hjh0827.tistory.com/24 는 집에서 공부하는 vue 방식이라 실제 프로젝트에서 개발하는 방식으로 변경하여 올려봅니다. VUE html 아이디 아이디 필수 정보입니다. input 정보엔 v-model로 signup.id 정보를 전달하고 길이를 20으로 제한 validation 영역은 if문을 이용해서 노출 비밀번호 비밀번호 유효하지 않은 비밀번호 입니다. input 정보엔 v-model로 signup.password 정보를 전달하고 길이를 16으로 제한 blur를 사용하여 비밀번호를 입력 후에 하단 passwordValidFlag 정보를 변경 validation 영역은 if문을 이용해서 노출 비밀번호 확인 비밀번호 재확인 비밀번호가 동일하지 않습니다. in..

[vue.js] 데이터 종류 별(data / object / array) button disabled 정리
서론 vue.js 개발하면서 자주 사용하는 dsiabled 를 정리해보려고 한다. 소스 html testobj --------------------------------------------------- test2obj --------------------------------------------------- 테이블 데이터 추가 테이블 데이터 삭제 --------------------------------------------------- testObj - a - testObj - b - testObj - c - testObj test2Obj - a - test2Obj - b - test2Obj - c - test2Obj all 설명 input 3개를 묶는 object 2개와 table 영역 그리고 데..

[vue.js] vue scroll 시 header fixed(by eventListener)
서론 vue.js 개발하면서 스크롤 이동시 이벤트 핸들링을 위한 기능을 정리한다. 소스 html header area header fixed area ---------------------------------- 1 설명 기존 header 와 fixed header 2개선언 * header를 1개로 사용하여 class로 fixed를 처리하면 순간 기존 header 영역이 사라지므로 높이가 변화가 되면서 ui 이슈가 있으므로 2개 선언하여 처리. 스크롤 특정 위치에서 fixed를 하기위한 ref 선언 스크롤을 만들기 위해 div를 50번 반복하고 script export default { data() { return { isFixed: false, }; }, mounted() { document.addEv..