[VUE] vue3 v-model props 로 넘기기 부모 컴포넌트 {{st.name}} 자식 컴포넌트 {{name}} 두개 props 로 넘기기 ``` const emits = defineEmits(['update:yearList', 'update:monthList']) emits('update:yearList', new Set(yearList)) emits('update:monthList', new Set(monthList)) } 💻 dev 2023.04.20
[vue] vue3 route 객체 import { useRoute } from 'vue-router' export default { setup() { const route = useRoute() onMounted(() => { const id = route.params.id }) } } 💻 dev 2023.03.03
[Vue] Vue-router 네비게이션 가드 방법 1 router.beforeEach(async (to, from) => { const dir = to.path.split("/")[2]; if (dir != "login" && !session.isLoggedIn()) { alert('로그인을 해주세요') await router.push("/m/login") } })방법 2 router.beforeEach(async (to, from) => { if (!to.path.startsWith("/m/login") && !session.isLoggedIn()) { alert('로그인을 해주세요') await router.push("/m/login") } }) 💻 dev 2023.01.13
[220527] vuex vuex 란 vue js 를 위한 상태 관리 패턴+라이브러리 이다. 상태란 데이터(반응성데이터) 이다. - State Vue 의 data - Getters Vue 의 computed - Mutations 수정 권한이 있는 method - Actions method - Modules import {createStore} from 'vuex' export default createStore ({ // data state() { return { count: 0 } }, // 계산된 data === computed getters:{ double(state){ return state.count * 2 } }, // 수정권한 메소드 //수정권한이 있는 mutations을 직접 내보내서 쓰는 경우는 피하는게 좋음 /.. 📓 TIL 2022.05.27
[VUE] vite 로 vue template 인스톨 https://vitejs.dev Vite vitejs.dev vite 시작 방법 npm create vite@latest 폴더이름 cd 폴더이름 code . -r npm i npm run dev 💻 dev/👩🏻💻 핀테크 프론트엔드 개발자 과정 2022.05.27
[220516] data / methods/ computed/ watch 디렉티브 : v- 접두사가 있는 특수 속성 https://kr.vuejs.org/v2/guide/syntax.html 템플릿 문법 — Vue.js Vue.js - 프로그레시브 자바스크립트 프레임워크 kr.vuejs.org Search! {{ movie.Title }} More {{msg}} {{reverseMsg()}} {{reversedMsg}} vue Js vue의 data() 란 반응형 데이터, 반응성을 가진 데이터다. - v-for 에 key값이 있으면 기억을 해서 변동사항이 있어도 리렌더링할 필요가 없다. - comfuted vs method 캐싱은 한번만 계산됌 메소드는 매번 계산 const App = { //반응형 데이터 || 반응성을 가진 데이터 data() { return { title:.. 📓 TIL 2022.05.16