vue.js/vue.js 기능

반응형

    [vue.js] select 사용법 및 총 정리(feat. method 호출 및 데이터 제어)

    문제 selectbox 클릭시 메소드를 호출해서 validation 체크 후 특정 select 선택을 막는 기능이 필요했다. 보통 selectbox 데이터는 v-model로 v-model 데이터만 초기화 하면 되겠지 하는 생각을 하며 개발 진행했는데 되지 않아서 테스트한 내용과 해결 방법을 정리해보려고 한다. 기본 selectbox html v-model select - {{ item.name }} ------------------------------------- 선택 value: {{ selected2 }} 설명 기본적인 selectbox로 select는 v-model로 제어를 하고 option 하위에 selectList를 v-for를 이용하여 적용하였다. 선택한 데이터를 보기 위해 selected2..

    [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..

반응형