본문 바로가기
반응형

전체 글330

[Vue] Vuex 개념 정리 Vuex - 여러 개의 component가 같은 상태를 유지하기 위한 상태 관리를 해주는 역할 - 중앙 저장소에 데이터를 모아서 상태 관리 - 규칙을 설정하며, Vue의 반응성을 효율적으로 사용하는 상태 관리 기능 - 다음 명령어를 통해 사용 가능 vue create vuex-app cd vuex-app vue add vuex​ export default new Vuex.Store({ state { }, getters:{ }, muations:{ }, actions:{ }, modules:{ } }) state - 중앙에서 관리하는 모든 상태 정보 - vue 인스턴스의 data에 해당 - $store.state로 state 데이터에 접근 Mutations - 실제로 state를 변경하는 방법 - Muta.. 2023. 5. 8.
[Vue] Props & Emit Event 정리 Pass Props - 요소의 속성을 사용하여 데이터를 전달함 - props는 상위 컴포넌트의 정보를 전달하기 위한 사용자 지정 특성 - 하위 컴포넌트는 props 옵션을 사용하여 수신하는 props를 명시적으로 선언 - 부모에서 넘겨주는 props는 kebab-case로 작성 - 자식에서 받는 props는 camelCase로 작성 - 단방향 바인딩을 형성하므로 하위 컴포넌트에서 props를 변경 불가 // Parent.vue Partent // child.vue Child {{ staticProps }} ​ // ---------------------------------------------- // Dynamice Props // Parent.vue Partent :dynamic-props="dyna.. 2023. 5. 8.
[Vue] compute, watch, filter 개념 computed - 템플릿의 데이터 표현을 더 직관적이고 간결하게 도와주는 속서 - computed 객체에 정의한 함수를 페이지가 최초 렌더링 될 때 호출하여 계산함 // 기본표현식 {{ number1 + number2 }} // computed 사용시 {{ result }} computed{ result(){ return number1 + number2 } }​ watch - 특정 데이터의 변화를 감지하여 자동으로 특정 로직을 수행 + ​ filters - 화면에 표시되는 텍스트의 형식을 쉽게 변화해주는 기능 {{ message | change }} 2023. 5. 7.
[Vue] 기초 속성 및 바인딩 개념 정리 기초 속성 el (elemnt) - Vue instance와 DOM을 연결하는 옵션 - View와 Model을 연결 - Vue instance와 연결되지 않은 DOM 외부는 Vue의 영향을 받지 않음 {{ message }} // 정의 되지 않았다는 경고 출력 {{ message }} // {{ message }} 그대로 출력 ​ data - Vue instance의 데이터 객체 혹은 인스턴스 속성 - 기본 객체여야하며, 객체 내부 아이템들은 모든 타입의 객체를 가질 수 있음 {{ message }} // Vue 출력 ... ​ methods - Vue instance의 method를 정의하는 곳 - method를 호출하여 data 변경이 가능함 ​ ----- // 콘솔창에 명령어 사용 app.start.. 2023. 5. 7.
[백준 2667] 단지번호붙이기 (python) https://www.acmicpc.net/problem/2667 2667번: 단지번호붙이기 과 같이 정사각형 모양의 지도가 있다. 1은 집이 있는 곳을, 0은 집이 없는 곳을 나타낸다. 철수는 이 지도를 가지고 연결된 집의 모임인 단지를 정의하고, 단지에 번호를 붙이려 한다. 여 www.acmicpc.net 단지번호 붙이기 문제 N * N 크기의 정사각형의 칸에 이어진 숫자 단지들의 총 개수와 각 단지의 크기를 구하는 문제 BFS개념을 활용하여 해결할 수 있었다. 📌 문제 접근 포인트 1. 마을의 수를 탐색하고, 이어진 칸을 확인하는 것이므로 너비 탐색(BFS)을 이용하여 탐색을 진행해 주자. 2. 방문처리와 탐색을 동시에 진행하고, 리스트를 하나 만들어줘서 탐색하면서 세어준 개수를 넣어주자. 또 진행.. 2023. 5. 7.
[백준 1541] 잃어버린 괄호(python) https://www.acmicpc.net/problem/1541 1541번: 잃어버린 괄호 첫째 줄에 식이 주어진다. 식은 ‘0’~‘9’, ‘+’, 그리고 ‘-’만으로 이루어져 있고, 가장 처음과 마지막 문자는 숫자이다. 그리고 연속해서 두 개 이상의 연산자가 나타나지 않고, 5자리보다 www.acmicpc.net 잃어버린 괄호 문제 +와 -로 이루어진 숫자 계산식에 괄호를 쳐서 값을 최소로 만드는 문제 단순 계산 아이디어를 떠올려서 split을 이용해 풀 수 있었다. 📌문제 접근 포인트 1. +와 -로 이루어진 숫자 계산식에 괄호를 쳐서 최솟값을 만들려 한다는 건 즉 - 사이의 숫자들을 모두 더해서 빼주면 된다는 뜻이다. 예를 들어 25-20+15-5+10+15 이런 숫자가 있다면 최소로 만들어주려면.. 2023. 5. 7.
반응형

티스토리툴바