분류 전체보기 (157) 썸네일형 리스트형 [Vue.js] style (1) style 예제1) 위 코드는 computed 를 이용하여 pStyle 이라는 함수안에 fontColor , fontSize 을 입력하고 input 안에 v-model으로 입력하여 값을 수정함에 따라 폰트 색상, 크기가 변경되도록 하는 코드이다. 기본 디폴트 값으로 폰트 색상은 black , 크기는 16px 으로 설정된 상태이다. 폰트 색상을 yellow, 크기를 25 으로 입력하여 폰트 스타일을 변경하였다. [Vue.js] class (3) class 예제 3) class 예제1과 동일한 동작을 하는 코드이지만 3항 연산자를 활용하여 작성한 코드이다. isInfo, isLg 가 true/false 상태에 따라 btn-info, btn-lg값이 class안에 입력된다. [Vue.js] class (2) class 예제 2) class 1번 예제랑 동일한 동작을 하는 코드이지만 computed 를 사용하여 그안에 obj() 함수를 선언하여 값을 리턴해준다. 체크박스의 버튼을 클릭하면 obj() 함수 안의 this.isPrimary, this.isLg 도 영향을 받는다. [Vue.js] class (1) class 예제 1) v-bind:class 으로 클래스 속성의 값을 사용 할 수 있다. isPrimary, isLg 가 data에서 boolean 으로 관리되어 체크박스를 체크하면 isPrimary,isLg는 true로 바뀐다. isPrimary, isLg 가 false 일땐 Vue 버튼에 디자인에 변화가 없지만 isPrimary, isLg 가 체크박스 체크로 인하여 true 로 바뀌었을땐 Vue 버튼의 디자인이 적용된다. [Vue.js] model (2) model 예제 2) v-model 사용하여 msg, isChecked, lunch, comment, isRun 의 값들이 관리 될 수 있다. [Vue.js] model (1) model 예제 1) 두개의 input 요소에 첫번째 input 에서는 v-model 을 사용하여 input 에 값을 입력하면 msg 의 값도 바뀌는 코드이고 두번째 input 에서는 onInput 이라는 함수를 호출하여 input 요소의 value 를 msg2의 값으로 바꾸는 코드이다. 첫번째 input 요소에서 값을 입력하면 아래의 p 요소에 적은 값이 실시간으로 반영된다. 두번째 input 요소에서도 값을 입력하면 아래의 p 요소에 적은 값이 반영된다. [Vue.js] Event (5) Event 예제 5) 두개의 form 중에서 첫번째 form은 onSubmit 함수 안에 .preventDefault(); 메소드를 이용하여 폼 제출을 막는 동작을 하는 함수이고 두번째 form은 .prevent 수식어를 이용해서 폼 제출을 막는 동작을 구현하였다. 두개의 form 모두 폼 제출을 막는 동작을 하지만 함수안에서 사용할지, 수식어를 이용할지의 차이점이 있다. 두개의 폼에서 input 값을 입력하고 전송버튼을 눌러도 두 폼 모두 아무런 동작을 하지 않는다. [Spring] MyBatis 기반 DB 연동 셋팅 및 연동 Servers > context.xml 파일에 해당 구문 추가 src > main > webapp > WEB-INF > spring > appServlet > servlet-context.xml 파일에서 아래 구문 해당 위치에 붙여넣기 src > main > resources > mapper(폴더생성) > MemberMapper.xml(생성) 해당 위치에 폴더와 xml 파일을 생성하고 아래 내용 붙여넣기 src > main > resources > mapper(폴더생성) > Configuration.xml (파일생성) 해당 위치에 아래 구문 붙여넣기 DB연결을 이용하여 member table의 list 가져오기 com.gura.spring02.member.controller 패키지에 위치한 MemberC.. 이전 1 2 3 4 5 6 ··· 20 다음
