vue3 [Vue]Pass Object as Router Params, 라우트 파라미터로 오브젝트 넘기기 Intro Vue에서는 다른 페이지로 이동하기 위해 Vue Router를 사용합니다. Router를 사용하다 보면 단순히 페이지만을 옮기는 게 아닌 데이터도 함께 옮기고 싶은 때가 있습니다. 그럴 때를 위해 query와 params를 Vue Router는 준비해 두었죠. 하지만 요게 요게 맘대로 안 될 때가 있습니다. 바로 Object 형식의 데이터를 옮기고 싶을 때 말이죠. Result // PUSH const router = useRouter() router.push({ name: 'xxx', params: { 'A': JSON.stringify({ stringify: 'JSON.stringfy', GOOD: 'So GOOD!!!' }) } }) // RECEIVE const route = useRo.. 2022. 4. 29. [Vue]Reactivity System, 뷰에서 값이 바뀔 때 일어나는 일 Intro 안녕하세요. 개발자 위성빈입니다. 오늘은 Dynamic Components에 이어서 Vue의 Reactivity 시스템에 대해서 알아보려 합니다. 그저 머릿속에만 있는 거보단 글로 남기는 게 기억도 잘 되고, 글을 쓰면서도 더 찾아보게 되니 참 좋은 거 같아요. 하지만 역시 글을 쓰는 게 쉽진 않네요. Vue Reactivity Vue의 장점이라고 하면 꼭 등장하는게 있습니다. 바로 Data Binding입니다. Vue의 데이터 바인딩은 화면에 표시되는 값과 데이터 값이 연결이 되어 서로를 변경시키기 때문에 양방향 데이터 바인딩이라고도 합니다. 그리고 이 양방향 데이터 바인딩이 가능한 이유가 Vue의 Reactivity 시스템 덕분입니다. Vue Guide Reactivity in Depth .. 2021. 12. 26. [Vue]Dynamic components, 내가 원할 때 내가 원하는 컴포넌트 불러오기 Intro 안녕하세요. 개발자 위성빈입니다. 최근에 Vue.js 공부를 시작했습니다. 새롭게 배운 놈이니 바로 써먹고 싶어 개인 프로젝트를 시작했죠. 프로젝트 제목은 'everything', '대시보드 위에 생각나는 모든 것을 올려보자'라는 아이디어를 바탕으로 차근차근 진행하고 있습니다. 그러다 만난 'Dynamic components', 동적 컴포넌트를 구현하면서 겪었던 것들을 오늘 적어보려 합니다. Result export default{ // ... data() { return { // ... , currentTab: 'VueRouter' } }, computed: { componentLoader() { const tab = this.currentTab return () =>import(`@/com.. 2021. 12. 26. 이전 1 다음
