분류 전체보기 (370) 썸네일형 리스트형 [Vue3] 이벤트 핸들링 (v-on) 1. Inline Handlers- 주로 간단한 상황에 사용한다.- v-on은 생략하고 @만 쓸 수 있다. Add 1 Count: {{ count }} 2. Method Handlers- Inline handlers로는 불가능한 대부분의 상황에서 사용한다.- 기본 DOM Event 객체를 자동으로 수신한다. Hello Inline Handler에서의 메서드 호출- 메서드 이름에 직접 바인딩하는 대신 Inline Handler에서 메서드를 호출할 수도 있다.- 이렇게 하면 기본 이벤트 대신 사용자 지정 인자를 전달할 수 있다. Inline Handlers에서의 event 인자에 접근하기- Inline Handlers에서 원래.. [Vue3] 동적 데이터 바인딩 (v-bind) 1. Attribute Bindings- HTML 속성 값을 Vue의 상태 속성 값과 동기화되도록 한다.- v-bind는 생략하고 : 만 쓸 수 있다. Move to url - 대괄호로 감싸서 argument에 Javascript 표현식을 사용할 수 있다.- 대괄호 안에 작성하는 이름은 반드시 소문자로만 구성 가능하다. (브라우저가 속성 이름을 소문자로 강제 변환)- Javascript 표현식에 따라 동적으로 평가된 값이 최종 argument 값으로 사용된다. Dynamic Attr 2. Class and Style Bindings- 클래스와 스타일 모두 속성이므로 v-bind를 사용하여 문자열 값을 할당할 수.. [Vue3] 템플릿 문법 1. Text Interpolation- 이중 중괄호 구문(콧수염 구문)을 사용한다.- v-once directive를 사용하면 렌더링 이후 값이 변경되어도 처음 렌더링 할 때의 값을 유지한다. Message: {{ msg }} once : {{ msg }} msg 변경 2. Raw HTML- 콧수염 구문은 데이터를 일반 데이터로 해석하기 때문에 실제 HTML을 출력하려면 v-html을 사용해야 한다. {{ rawHtml }} 3. Attribute Bindings- 콧수염 구문은 HTML 속성 내에서 사용할 수 없다.- v-bind directive를 사용하여 데이터를 HTML 태그의 속성 값과 .. [Vue3] Vite를 이용하여 Vue 프로젝트 생성하기 1. npm을 사용하기 위해 Node.js를 설치한다.https://nodejs.org/ko/ 2. cmd창을 켜고 프로젝트를 생성할 폴더로 이동한다.3. npm create vue@latest 명령어를 입력하고 프로젝트 이름과 옵션을 선택하면 프로젝트가 생성된다. 4. 프로젝트 폴더로 이동하여 code . 명령어로 vs code를 실행한다. 다음과 같이 폴더와 파일들이 생성된 것을 확인할 수 있다. 5. vs code에서 터미널을 열고 npm install 명령어로 npm을 설치한다. node_modules 폴더와 package-lock.json 파일이 추가된다. 6. npm run dev 명령어로 실행한다. [BOJ] 5373번 큐빙 (C++) https://www.acmicpc.net/problem/5373 5373번: 큐빙 각 테스트 케이스에 대해서 큐브를 모두 돌린 후의 윗 면의 색상을 출력한다. 첫 번째 줄에는 뒷 면과 접하는 칸의 색을 출력하고, 두 번째, 세 번째 줄은 순서대로 출력하면 된다. 흰색은 w, 노란 www.acmicpc.net #include using namespace std; char cube[6][3][3]; // 위, 아래, 앞, 뒤, 왼, 오 void make_cube() { for (int k = 0; k < 6; k++) { switch (k) { case 0: for (int i = 0; i < 3; i++) { for (int j = 0; j < 3; j++) { cube[0][i][j] = 'w'; } .. [BOJ] 1967번 트리의 지름 (C++) https://www.acmicpc.net/problem/1967 1967번: 트리의 지름 파일의 첫 번째 줄은 노드의 개수 n(1 ≤ n ≤ 10,000)이다. 둘째 줄부터 n-1개의 줄에 각 간선에 대한 정보가 들어온다. 간선에 대한 정보는 세 개의 정수로 이루어져 있다. 첫 번째 정수는 간선이 연 www.acmicpc.net #include #include using namespace std; int n; vector tree[10001]; bool visited[10001]; int max_len = 0; int end_node = 0; void dfs(int node, int len) { if (visited[node]) return; visited[node] = true; if (len > m.. [BOJ] 2961번 도영이가 만든 맛있는 음식 (C++) https://www.acmicpc.net/problem/2961 2961번: 도영이가 만든 맛있는 음식 첫째 줄에 재료의 개수 N(1 ≤ N ≤ 10)이 주어진다. 다음 N개 줄에는 그 재료의 신맛과 쓴맛이 공백으로 구분되어 주어진다. 모든 재료를 사용해서 요리를 만들었을 때, 그 요리의 신맛과 쓴맛은 www.acmicpc.net #include #include using namespace std; int n; int ans = 987654321; int ingredients[10][2]; int main() { cin >> n; for(int i = 0; i > ingredients[i][0]; cin >> ingredients[i][1]; } int noc = 1 [C++] 비트 연산 ※ int는 32bit (4byte)이지만, 이 게시물에서 편의상 8bit로 표현하였음 비트 연산자 a = 0b1110 / b = 0b0100 활용 & (AND) a & b = 0b0100 둘 다 1이면 켜짐 어떤 비트가 켜져 있는지 확인 | (OR) a | b = 0b1110 둘 중 1이 하나라도 있으면 켜짐 비트를 켤 때 ^ (XOR) a ^ b = 0b1010 서로 다르면 켜짐 비트를 끄거나 반전시킬 때 ~ (NOT) ~a = 0b0001 비트를 반전시킴 비트를 끌 때 (&와 함께 사용) (오른쪽 Shift) a >> n = a * (2 ^ -n) 비트 연산을 사용할 때 우선순위에 주의가 필요하다. 일반적으로 사칙연산(+, -, *, /)은 비교, 논리 연산자(==, >, && 등)보다 우선순위가 .. 이전 1 2 3 4 5 6 7 ··· 47 다음
