# vuejs
[Error Report] Swiper와 v-for 동시 적용 시, 배열의 첫 번째 요소만 출력되는 문제 (watch, computed 활용 로그 분석)
vuejs는 데이터 변경이 감지되면 자동으로 뷰를 다시 렌더링하여 변경 사항 반영함.<li> v-for 적용 시 변수에 할당된 배열의 요소중 첫번째 요소에만 할당되는 현상 확인swiper 라이브러리와 동시에 사용한 것이 문제일까? 확인 예정..데이터 변경과 화면에
MVVM 모델에서의 Vue
MVVM 패턴의 뷰 모델(ViewModel) 레이어에 해당하는 화면(View)단 라이브러리DOM Listeners사용자가 마우스 클릭이나 키보드를 입력한다던지, 이벤트를 중간에 DOM Listeners가 청취하게 된다. 그러한 이벤트들을 잡아서 JS에 있는 데이터를 바
Vue vscode setting
VSCode 에서 Vue를 사용하기 위해 다운 받을 만한 플러그인 들.VeturVue.js 관련 플러그인이다.Night OwlVSCode 테마관련 플러그인이다.Material Icon Theme아이콘 관련 테마.ESLintjs 관련 플러그인, 오류를 표시 해 주는 플러
Springboot Vuejs 빌드
스프링부트 공부하다가 복습겸 to do list 프로젝트 시작함화면 부트스트랩으로 할까 했는데 우연히 codepen 이라는 곳을 알게되었다여기서 마음에 드는걸 찾았는데 코드를 보니까 vue라고 쓰여져 있는걸 발견...!그래서 갑자기 Vuejs 빌드하게됨처음부터 난관에
개인 학습을 멈추지 말자.
취직은 했는데 내 생각과 다른 웹 개발이라 조금 슬픔나는 백엔드 위주로 공부 했고, Spring을 다뤘음. 주로 Spring boot.아주 잠깐 node로 (expressJs) 뭔가 만들어 보긴 했는데 워낙 옛날이기도 하고Spring보단 깊이가 너무 덜하다.그래도 문법
Vue.js 모르는 문법 정리
: 'v-'로 시작한다.: 디렉티브 속성 값은 단일 JavaScript 표현식이 된다. (v-for, v-on and v-slot는 예외)📌 기본 디렉티브v-bind:태그 속성을 동적으로 바인딩할 때 사용한다.Shorthand: : or . (when using .p
<vue> ref와 reactive 차이
vue에서 ref와 reactive의 차이를 확인해보고 어떻게 사용하는 것이 좋을 지에 대해서 작성하였다.
<vue> v-bind와 v-on로 html input 요소 바인딩 하기
vueJS 를 이용하여 html input 요소들의 데이터를 가져오기 위한 v-bind 및 v-on에 대한 간략한 예시를 작성하였습니다.
기업프로젝트 - 코드 분석
📂 routerrequireAuth.js관리자의 권한이 필요하는 로직을 짜는 거 같은데아마 next()로 그냥 이동하게 한거 같다.to : 이동할 url 정보가 담긴 라우터 객체from : 현재 url 정보가 담긴 라우터 객체next : to에서 지정한 url로 이동
Vue.js-axios, await, async
뷰에서 권고하는 HTTP 통신 라이브러리는 액시오스(Axios)입니다.Promise 기반의 HTTP 통신 라이브러리이며 상대적으로 다른 HTTP 통신 라이브러리들에 비해 문서화가 잘되어 있고 API가 다양합니다액시오스 참고자료(https://joshua1988
Vue.js 금액 콤마(,) 구현
쇼핑몰을 하면서 금액에 콤마를 구현해야하는 일이 생겼다.구글에 검색하면 filter를 사용하여 comma를 넣어서 하는데vue 버전이 올라가면서 filter 기능이 사라졌다고 한다그러다가 찾은 방법이다.전혀 어렵지 않은 방법으로 구현했다.Number안에 금액을 넣어주고
Vue.js 회원정보수정 구현
구현방법을 알려주기 전에 일단 v-model을 사용하지 않았다.v-model를 하려면 data에 default값을 넣어놔야하는데 그럼 원래의 회원정보가 불러오지 못하고 공백처리가 되었다.비밀번호확인 빼고는 javascript처럼 document.getElementByI
Vue.js 찜하기 목록에서 삭제 (배열 삭제 구현)
찜하기 목록에서 삭제하고 싶은 찜 상품 삭제하기버튼 @click 이벤트를 구현할 것이다.메소드안에 가져올 productNum를 넣어주면 끝가져온 값을 val이라고 하면val을 request에 담아서 보내면 끝!
Vue.js 쇼핑몰 찜하기 구현
쇼핑몰 찜하기 구현 >1. 찜하기 전엔 빈하트 / 빈하트를 누름과 동시에 찜하기 성공 찜한 후 빨간 하트 / 빨간 하트 누름기ㅘ 동시에 찜하기 취소 찜하기 / 찜하기 취소 버튼 >1. 찜하기 버튼에 @click = "liked" 이벤트 발생 찜취소 버튼에 @click