🖥 dev-ruby

문제 설명 로또 6/45(이하 '로또'로 표기)는 1부터 45까지의 숫자 중 6개를 찍어서 맞히는 대표적인 복권입니다. 아래는 로또의 순위를 정하는 방식입니다. 순위당첨 내용 1 6개 번호가 모두 일치 2 5개 번호가 일치 3 4개 번호가 일치 4 3개 번호가 일치 5 2개 번호가 일치 6(낙첨) 그 외 로또를 구매한 민우는 당첨 번호 발표일을 학수고대하고 있었습니다. 하지만, 민우의 동생이 로또에 낙서를 하여, 일부 번호를 알아볼 수 없게 되었습니다. 당첨 번호 발표 후, 민우는 자신이 구매했던 로또로 당첨이 가능했던 최고 순위와 최저 순위를 알아보고 싶어 졌습니다. 알아볼 수 없는 번호를 0으로 표기하기로 하고, 민우가 구매한 로또 번호 6개가 44, 1, 0, 0, 31 25라고 가정해보겠습니다. ..

1. router 설치하기 npm install vue-router@4 2. router 폴더 생성 src/router.js 생성 후 import { createWebHistory, createRouter } from "vue-router"; // import 컴포넌트 const routes = [ { path : "/list", // 이 경로로 접속하면 component : List, // 이 컴포넌트로 넘어가게 해주세요 }, { path : "/home", component : Home, }, { path : "/detail/:id", //detail/:아무문자 component : Detail, }, ]; const router = createRouter({ history: createWebHist..

1. 왜 배울까? -> 훅을 쓰기위해 훅이란? 다음 단계로 가기 전에 이걸 실행해주고 가세요~라고 후크를 거는 것 1. create 단계 데이터만 존재하는 단계 2. mount 단계 사이에 있던걸 실제 html로 바꿔주는 단계 mounted함수를 사용하면 코드가 실제 html로 변환이 된 후에, 함수가 실행이 된다. 3. 컴포넌트 생성 inde.html에 장착하는 단계 4. update 단계 5. unmount 단계 2. hook 종류 create단계 전 : beforeCreate() create단계 후 : created() mount단계 전 : beforeMount() mount단계 후 : mounted() update단계 전 : beforeUpdate() update단계 후 : u..

1. 받아온 데이터를 두 변수에 저장 후, 한 변수만 sort시키면 다른 변수는 원본 그대로일까? 아니다. 같은 array를 할당받은거기 때문에 그 변수도 같이 정렬된다. => 별개의 데이터로 저장하기a= [...data], //data와는 완전히 다른 카피본을 만들어 주세요~ b= data 2. array를 별개의 데이터로 저장 후, 다시 원본으로 돌리기 위해 대입을 한다면? array는 '=' 등호로 대입하면 왼쪽 오른쪽 값을 공유한다는 뜻이 되기 때문에, 같은 메모리 주소를 갖게 된다. 따라서 this.b = [...this.a]; //또 다른 카피본으로 대입해줘야 함

1. :class="" CSS로 애니메이션주기 - 모달창이 서서히 열리는 애니메이션 .start{ opacity: 0; transition: all 1s; } .end{ opacity: 1; } '모달창열렸니'가 true가 될 때만 end클래스가 적용이 된다는 뜻 transition: all 1s 는 클래스의 모든요소의 변화가 생길 때 1초가 걸린다는 뜻 2. - Vue제공 태그 사용 애니메이션 주고싶은 요소를 감싼다 3. 창 열릴 때 enter-from, enter-active, enter-to : 에 class 작성 name지정 css에 3개의 클래스 선언 .fade-enter-from{ opacity: 0; // 시작 시 스타일 } .fade-enter-active{ tr..

1. watcher란? 사용자가 input에 입력한 자료의 유형이 일치하는지 검사해주는 2. 사용법 export default에 watch라는 이름으로 등록 watch(){ } 그 안에 감시할 데이터 이름으로 함수형식으로 작성 watch : { 감시할데이터(){ // 동작 작성 } } 그럼 month라는 데이터가 변할 때마다 month안에 있는 코드가 실행된다 watch : { month(a){ if(a >= 13) alert('13개월은 안팔아요~!'); }, }, 2-1. month(a){} a는 month의 값이다 2-2. month(a,b){} b는 변경 전 데이터가 된다