store 사용 방법 관련 질문입니다.

안녕하세요! 두가지 질문을 해주셨는데, 넘버링하여 답변드리도록 하겠습니다 ^^ 1. 결론적으로만 말씀드리자면 네. 실제로 스토어에 저장해서 사용하기도 합니다. 2. 저장하는 양에 한계는 없지만 처리할 데이터가 많다면 성능 이슈가 발생할 가능성이 높습니다. 보통 많은 데이터를 처리할 때는 말씀하신 대로 필요할때 불러서 처리합니다. 예를 들어 게시판같은 리스트 형식은 페이징 처리를 하거나 무한스크롤 처리를 하지요? 같은 이유입니다 ^^ 감사합니다.

removeItem 에서 element 가 하나 남았을 때 삭제가 되지 않는 문제

안녕하세요! 일단 보내주신 코드는 올바른 접근 방법입니다. 보통 데이터에서 id는 해당 아이템의 고유한 값으로 설정되므로, findIndex를 사용하신것은 아주 휼륭한 판단이십니다.👍👍 (제가 예제로 코딩한 부분은 편의를 위해 일반적인 id와는 다르게 array상에서 아이템의 인덱스의 용도로 사용하였습니다.) 하지만 그 전에 왜 삭제가 되지 않는 버그가 있는 것 인지 확인해 보니, ItemInput 컴포넌트에서 addItem 할 때, id 값을 설정하는 부분에서 문제가 있는것으로 보입니다. ㅠㅠ addItem() { this.$store.commit('addItem', { id: this.todoList.length + 1, title: this.title, status: 'active', });} 코드와 같이 todolist 아이템 개수 + 1 = id 입니다. 그리고 이 id값은 스토어에서 removeItem, ChangeStatus에서 todolist Array의 특정 item을 찾는 인덱스 값이 됩니다. 여기서 포인트는 ⭐Array의 인덱스는 0부터 시작⭐한다는 것입니다!! 따라서 영상 말미에 새로 추가한 아이템의 id는 기존 아이템 개수인 2개에 1을 더해 3이 되고, todolist Array의 세번째에 추가되고 인덱스는 2가 됩니다. ex. [첫번째 아이템: 인덱스0, 두번째 아이템: 인덱스1, 새로 추가한 세번째 아이템 인덱스2] id와 인덱스가 동일하지 않기때문에 이 추가된 아이템은 삭제가 되지 않습니다. 이에 따라 혼동을 드린 점 정말 죄송합니다 ㅠㅠ 빠른 시일내에 잘못 된 부분은 업데이트 될 수 있도록 하겠습니다. 다른 문의 사항이 있으시면 편하게 질문 게시판 남겨주세요!

Property '$route' does not exist on type 'ItemList'. 이 에러는 무엇인가요..?

안녕하세요! $route가 this, 즉 class 내부에 타입이 정의되어 있지 않아 발생하는 typescript warning입니다. 아래와 같이 vue-router에서 type을 수동으로 import해서 해결하실 수 있습니다. import { Vue } from 'vue-property-decorator' import 'vue-router/types/vue' @Component export default class MyComp extends Vue { click() {console.log(this.$route)} } 자세한 내용은 아래 링크를 참고해 보시기 바랍니다. https://github.com/nuxt-community/typescript-template/issues/23

Cannot find module '@/components/message.vue'.

안녕하세요. https://github.com/vuejs/vetur/issues/762 이 링크의 마지막쯤을 보시면 For now, the quickest fix for this error is to rearrange your folder structure in VS Code. To fix: Manually drag your Vue App's Folder to the top of your opened projects inside of your VS Code workspace. 이런 내용이 있습니다. vue 프로젝트 폴더를 오픈해서 해결되었다는 내용입니다. tsconfig.json 파일이 vue_study 폴더의 루트에 있는것이 중요한것이 아니라 해당 vue 프로젝트가 vscode workspace의 루트에 있냐가 중요한것 같습니다. vue_study 폴더를 열어서 사용하신것인지, vue_study 폴더가 포함된 상위 폴더를 열어서 사용하신것인지 먼저 확인해 보시기 바랍니당.. vue 의 이슈가 아니기 때문에 자세한 도움을 못드려 죄송합니다.ㅠㅠ 그럼 두번째 질문에 대한 답변을 드리겠습니다. export default 를 클래스 앞에 붙이지 않으면 에러가 발생한다는 말씀이시죠? (제가 제대로 이해한건지 ㅠㅠ) App.vue는 main.ts에서 import 해서 사용하고 있습니다. 따라서 export default를 붙여주는 것입니다. 아래 링크에 import/export에 대한 자세한 설명이 있습니다. https://medium.com/@enro2414_40667/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-export-import%EC%A0%95%EB%A6%AC-137ac9e327d9 제가 질문을 잘못 이해한 거라면 좀 더 구체적인 내용으로 재질문 부탁드리겠습니다. 감사합니다.

Cannot find module '@/components/message.vue'.

안녕하세요. 해당 프로젝트를 clone해서 확인해 보았는데, 일단 말씀해주신 Home.vue라는 파일이 없습니다 ㅠㅠ 실행해보니 Cannot find module~ 이라는 에러는 발생하고 있지 않구요. 아마 vscode쪽 이슈인듯 합니다. 제가 vscode를 사용하지 않아서 정확히는 모르지만... 조금 검색해본 결과 혹시 vscode에서 프로젝트의 상위 폴더로 open하여 작업하고 계신것은 아닌지 확인해 보시기 바랍니다. (ex. 프로젝트 폴더 이름이 vue-study라면, vscode에서 vue-study의 상위 폴더로 오픈하여 작업) tsconfig.json이 root에 있지 않으면 동일한 에러가 발생하는 듯 합니다. 아래 링크를 참고해 보시기 바랍니다. https://github.com/vuejs/vetur/issues/762 두번째로 질문주신 export default는 Home.vue가 없어서 답변이 불가능합니다. ㅠㅠ 감사합니다.