반응형 전체 글144 vue3 ref와 reactive 사용법과 차이점 Options API는 data, methods, mounted 와 같은 옵션을 사용. (vue3 이전 버전)Composition API는 반응형 코드를 작성하는 단일 setup 함수가 있음. (vue3)composition api는 vue 컴포넌트를 작성할 수 있는 api세트이다. 그 중 ref와 reactive는 컴포넌트와 별개로 사용할 수 있는 반응형 데이터를 생성할 수 있다. ref는 premity type(string, number, object) 어떠한 타입도 사용할 수 있고,reactive는 object, array, map, set과 같은 타입에서만 사용할 수 있다. 객체를 선언할때 둘 다 사용할 수 있는데, ref를 사용하면 객체를 한꺼번에 객체 할당할 수 있다.반대로 reactive.. 2024. 8. 5. vue router 이동 // 리터럴 문자열 경로router.push('/users/eduardo')// 경로가 있는 개체router.push({ path: '/users/eduardo' })// 이름을 가지는 라우트router.push({ name: 'user', params: { username: 'eduardo' } })// 쿼리와 함께 사용, 결과적으로 /register?plan=private가 됩니다.router.push({ path: '/register', query: { plan: 'private' } })// 해시와 함께 사용, 결과적으로 /about#team가 됩니다.router.push({ path: '/about', hash: '#team' }) 2024. 8. 3. javascript에서 this 컨트롤 하기 * 해당 글은 정리가 잘 된 포스팅 글 전체를 가져온 글입니다. (공부를 위해 타이핑..) 같은 글이니 아래 링크에서 포스팅 확인하세요 :) https://poiemaweb.com/js-this this는 매개변수로 전달되는 인자값 이외에 argument객체와 this를 암묵적으로 전달 받는다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로터피나 메서드를 참조할 수 있다. 크게보면 전역에서 사용할 때와 함수안에서 사용할 때로 나눌 수 있다. 자바스크립트에서 this는 함수 호출 방식에 따라 바인딩되는 객체가 달라진다. 1. 전역에서 선언된 함수에서의 this는 global(window, global)이다. 2. 함수 내부에서 사용하는 this - 엄격모드에서 일반 내부함수의 thi.. 2024. 4. 1. 브라우저 성능 최적화 앞 글에서 웹 최적화를 위해 reflow와 repaint에 대한 정리를 하면서 paint과정 외에도 composite라는 과정이 더 있는 점을 알게 되었다. composite는 브라우저가 각각의 레이어를 스타일 방식에 따라서 병렬적으로 레이어로 분류되고 paint을 한 후에 모든 레이어를 합치는 과정이다. 애니메이션을 처리하기 위해서 GPU도 사용하게 된다. GPU에서 애니메이션을 처리하므로 메인 스레드는 렌더링 레이아웃에 포커스를 둘 수 있게 된다. * 브라우저가 별도의 Layer 생성할 때 조건 * - video, canvas 태그 사용 - animation 이나 transition 사용 - will-change가 opacity, left, top, bottom, right, transform - i.. 2024. 3. 30. 이전 1 2 3 4 5 6 7 8 ··· 36 다음 728x90 반응형
