전체 글70 [Vue.js] Vue 클래스와 스타일 바인딩 개념 및 예제 Vue.js Vue 클래스와 스타일 바인딩 개념 및 예제 코드 - Vue 클래스 바인딩 Hello Click! 실행 결과 코드 - Vue 스타일 바인딩 스타일 바인딩 연습 실행 결과 2022. 4. 26. [Vue.js] Vue watch 속성 개념 및 예제 Vue.js Watch 속성 개념 및 예제 설명 Watch 속성 감시할 데이터를 지정하고 해당 데이터가 변경되면 정의된 함수를 실행한다. computed는 이미 정의된 계산식의 결과값을 반환할 때 사용되고 watch는 트리거와 같이 특정 조건에서 함수를 실행시키기 위해 사용된다. watch를 남용하는 것 보다 되도록 computed를 사용하기를 권장한다. 코드 {{ message }} Change! Changed? {{ updated }} 실행 결과 2022. 4. 26. [Vue.js] Vue computed 속성 개념 및 예제 Vue.js Computed 속성 개념 및 예제 설명 Computed 속성을 사용하는 이유 템플릿 내에 표현식을 넣으면 편리하지만 너무 많은 연산을 템플릿 안에서 하면 코드가 비대해지고 유지보수가 어렵기 때문에 아래의 코드같이 복잡한 로직은 반드시 Computed 속성을 사용해야 한다. {{ message.split('').reverse().join('') }} 코드 {{ reverseMessage }} 실행 결과 Computed 와 Method의 차이점 {{ reverseMessage }} {{ reverseMessage() }} 위의 두 코드는 같은 결과를 얻을 수 있다. 두 방식의 차이점은 1. 캐싱 computed 속성은 해당 속성이 종속된 대상이 변경될 때만 함수를 실행한다. message가.. 2022. 4. 26. [Vue.js] Vue 데이터 양방향 바인딩 개념 및 예제 Vue.js 데이터 양방향 바인딩 하는 법 코드 - 방법1 {{inputText}} 코드 - 방법2 {{inputText}} 실행 결과 2022. 4. 26. [Vue.js] Vue 이벤트 개념 및 예제 Vue.js 이벤트 발생시키는 법 onClick 이벤트 {{ number }} 더하기 // == 빼기 실행 결과 submit 이벤트 // : submit후 페이지 새로고침 방지 Submit 실행 결과 2022. 4. 26. [Vue.js] Vue 데이터 바인딩 개념 및 예제 Vue.js 데이터 바인딩의 개념 및 예제 설명 코드 입력 : // == 실행 결과 코드 입력 : // == 실행 결과 2022. 4. 26. [Vue.js] Vue의 데이터와 메소드 개념 및 예제 Vue의 데이터와 메소드 개념 및 예제 설명 Vue 데이터와 메소드 Vue 인스턴스가 생성될 때 data 객체에 있는 모든 속성이 Vue의 반응형 시스템에 추가되어 각 속성값이 변경될 때 화면이 렌더링된다. data에 있는 속성들은 인스턴스가 생성될 때 존재한 것들만 반응형이다. 코드 이름 : {{ person.name }} 나이 : {{ person.age }} 실행 결과 2022. 4. 26. [Vue.js] Vue 인스턴스 개념 정리 및 예제 Vue.js 인스턴스 생성하기 Vue 인스턴스 모든 Vue 어플리케이션은 새 Vue 인스턴스를 만드는 것부터 시작한다. Vue 어플리케이션의 구조는 루트 Vue인스턴스 밑에 하위 컴포넌트가 위치하는 컴포넌트 트리 구조이다. Vue 인스턴스를 생성할 때 data, methods, 라이프사이클 콜백 옵션 객체를 전달해야 한다. var vm = new Vue({ // option }) 코드 {{ text }} 실행 결과 2022. 4. 25. [프로그래머스] 핸드폰 번호 가리기 프로그래머스 1단계 핸드폰 번호 가리기 https://programmers.co.kr/learn/challenges 문제 설명 풀이 class Solution { public String solution(String phone_number) { String answer = ""; StringBuilder builder = new StringBuilder(phone_number); for(int i=0; i 2022. 4. 25. 이전 1 2 3 4 5 6 ··· 8 다음
