개강한 공대생 개강한 공대생

reduce는 for문과 비슷한 함수다. 대신 for문보다 좋은게 더 가독성이 좋고 어쩌면 더 최적화된 함수라는 것이다. 배열에 있는 모든 값에 대한 연산을 할 때 reduce만한게 없는 것 같다. 예시로 살펴보자. totalTables() {  return this.tables.reduce((sum, table) => sum + (table.count || 0), 0);} 위 함수는 전체 테이블의 수를 계산하는 함수이다.다음과 같은 함수를 computed에 넣었다고 해보자여기서 this.tables는 배열이다.그리고 table은 그 배열 안의 요소이다.(sum, table)이 부분은 인자다.=> 이것은 한줄 로직이라는 것을 나타내는 기호이다. 만약에 여러줄 로직이면 { ~~~~ } 이렇게 쓸 것이다....

computed 속성은 Vue 컴포넌트의 반응형 시스템의 중요한 부분이다. computed 속성을 이용하면 의존하는 데이터가 변경될 때 다시 계산하여 보여주는 것이 가능하다. 심지어 계산된 결과를 캐싱해준다. 그래서 의존하는 데이터가 변경되지 않는 한, 여러 번 그 페이지에 접속하여도 계산하는 함수를 다시 실행하지 않고 이전에 계산된 결과를 반환한다.. 이게 Vue의 라이프사이클 훅이 아닌 이유는 특정 시점에서 자동으로 실행되는 것이 아니라 의존하는 데이터가 변경될 때만 자동으로 재계산되는 식이기 때문이다.

DOM(Document Object Model)이 완전히 초기화됐을 때 실행되는 라이프사이클 훅이다. 예를 들어 컴퓨터 부팅이 모두 완료되었을 때 로딩되는 그런.. 프로그램 같은 느낌이다.

v-if는 조건부 렌더링을 위해 사용된다. 참일 경우 해당 요소와 그 내부의 모든 것이 렌더링된다. 거짓일 경우 해당 요소와 그 내부의 모든 것이 DOM에서 완전히 제거되어 보이지 않게 된다. 만약 요소를 DOM에서 유지하면서 단순히 숨기고 싶으면 v-show 를 이용할 수 있다.마치 display: hidden과 비슷한 느낌인 디렉티브다.

일단 vue를 설치하려면 Node.js를 설치해야 한다.공식 웹사이트에서 설치해주자. 설치하고 cmd로 가서 설치가 됐는지 확인해보라 명령어는 다음과 같다. node -v혹은npm -v 버전이 뜨면 잘 설치가 된거다.그리고 환경변수 편집에 들어가서 node.js가 설치된 폴더 경로를 PATH에 추가해주자. 그리고 vue를 이제 터미널에서 깔면 되는데 vscode 터미널이나 powershell, cmd 아무데서나 일단 깔 수 있다. vue를 설치하는 명령어는 다음과 같다. npm install -g @vue/cli 이거는 한 번만 입력하면 다음부터는 입력하지 않아도 되는 명령어다.vue 프로젝트를 생성하고 .. 그런 것들을 할 수 있는 명령어다.프로젝트 폴더가 아니더라도 된다. 이제 프로젝트 폴더에서 입력..

해당 v-btn의 클래스 css 안에 color: 원하는 색상 !important; 를 해주면 된다. 아무래도 기존의 v-btn 컴포넌트의 색상이 조금 강력해서 강제로 !important를 설정해줘야하는 것 같다. ㅋㅋㅋ

src에 data 폴더를 만들고 data명.js 파일을 만든다그리고 그 데이터를 사용할 vue 파일에서 import를 다음과 같이 해주자import { 데이터명 } from '@/data/ data명 '; 그 후 data(){    return {       데이터명: {},     };}이렇게 만들어두고created 훅을 이용해 다음과 같이 작성해주자created() {        this.데이터명 = 데이터명 ;} 그리고 데이터명.어트리뷰트이름 이런 형태로 사용하면 된다. 참고로 MockData의 예시이다.export const mockRestaurantData = [    {      restaurantName: "프프",      restaurantLocation: "한동대",      rest..