묻고 답해요
137만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결프로젝트로 배우는 Vue.js 3
52강의 originalTpdp ref 와 todo ref
res.data는 객체이기 때문에 todo.value = res.data 와origivalTodo.value = res.data 는다른 메모리 주소에 할당되는 것이 아닌가요?
-
미해결프로젝트로 배우는 Vue.js 3
delete todo 함수를 prop으로 내려주지 않는 이유는 무엇인가요??
부모 컴포넌트에서 delete todo 함수를 자식컴포넌트에서 내려주지 않는 이유는 무엇인가요? 자식 컴포넌트에서 값을 바꿔주면 안되서 일까요??
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
아이콘의 경우 새로 고침해야지 checkBtnCompleted가 적용됩니다
<template> <div> <ul> <li v-for="(todoItem, index) in todoItems" v-bind:key="todoItem.item" class="shadow"> <span v-on:click="toggleComplete(todoItem, index)"> <i class="checkBtn fas fa-check" v-bind:class="{ checkBtnCompleted: todoItem.completed }"></i> </span> <span v-bind:class="{ textCompleted: todoItem.completed }">{{ todoItem.item }}</span> <span class="removeBtn" v-on:click="removeTodo(todoItem, index)"> <i class="fas fa-trash-alt"></i> </span> </li> </ul> </div> </template>i 태그를 span 안에 넣은 이유는 클릭해도 아무 반응이 없어서 span 안에 넣었습니다.completed 관련한 v-bind는 새로고침 안해도 바로 반영되는데 checkBtnCompleted 관련한 v-bind는 새로고침 해야지 체크표가 회색으로 변합니다.어디가 문제인지 모르겠습니다
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
github 권한 요청 드립니다
인프런 아이디 : devdh.cho@samsung.com인프런 이메일 : devdh.cho@samsung.com깃헙 아이디 : rhsnfl1122깃헙 Username : JoDongHyuen
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
왜 발생하는 걸까요??Property or method "store" is not defined on the instance but referenced during render.
Todo-Header.vue 파일에 코딩된 내용은 아래와 같습니다.<template> <header> <!-- <h1>TODO it!</h1>--> <h1>{{ this.$store.state.headerText }}</h1> </header> </template>위 코드를 실행했을때 store 못 찾는 다고 나오는데 이유를 모르겠네요 ㅠ.ㅠ[Vue warn]: Property or method "store" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://v2.vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.found in---> <TodoHeader> at src/components/TodoHeader.vue<App> at src/App.vue<Root>
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
라이프사이클 질문입니다
왜 자식 컴포넌트인 LoginPage가 mounted가 안 됐는데 App.vue가 mounted가 돼 나요?
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
블로그 git 공유
Todo 앱 구현부분을 Option API와 Composition API 비교 용도로 참고하여 블로그 글을 쓰고 싶은데, 참조로 넣고 해당 소스를 조금 수정하여 사용하여도 될지 질문드립니다. 예제가 너무 좋아서 꼭 이 예제로 글을 써보고 싶습니다ㅠㅠhttps://github.com/pijoh3/Todo선생님 강의를 듣고 Vue3.0 버전에 맞춰 수정 및 브랜치를 따서 Composition API로 변경해볼 예정입니다.
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
index.html, App.vue, <template>, <script> 실행순서가 궁급하니다(라이프사이클 X)
수업 7_til-list 브랜치에서 그냥 console.log를 여러곳에 넣어보고 npm run serve 해보니 위와 같이 나와서 뭔가 혼란 스럽더라구요라이프사이클 훅은 어느정도 이해가 가는데왜 AppHeader.vue의 script태그가 제일 먼저 실행되고또 store/index.js와 routes/index.js는 main.js에서 import해오기 전에도 어디서 왜 먼저 실행되는지 모르겠습니다...그리고 main.js에서 store/index.js, routes/index.js를 import해오는 순서를 바꾸니까 콘솔 출력 순서도 바뀌더군요그냥 index.html, App.vue, main.js, store/index.js, routes/index.js, api/index.js, api/common/interceptors.js, 등 이런 .html, .vue의 <template>, .vue의 <script> , .js 실행 순서가 궁금합니다
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
GITHUB 권한 요청 드립니다.
안녕하세요.권한 주셨다고 하셨는데 404로 접근이 되지 않아 아래 정보로 권한 재요청 드립니다.감사합니다.인프런 아이디 : hyoarang@naver.com인프런 이메일 : hyoarang@naver.com깃헙 아이디 : hyoarang깃헙 Username : songsong
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
Node 버전변경, nvm 설치가 다른 프로젝트에도 영향 주나요?
초기 세팅하다 안돼서 폴더 다 삭제하고 처음부터 다시 했더니삭제전 노드, vue cli 버전이 그대로 뜨는데 수업 듣기 전 상태로 돌리는 방법이 있나요?
-
해결됨Vue.js 끝장내기 - 실무에 필요한 모든 것
vue create 할때 pick a unit testing solution은 안 떠요
vue-cli 5.0.8이라 선생님이 하라는대로 했는데 unit testing solution부분은 없는데 어떻게 하나요?
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃허브 권한요청드립니다
권한 요청드려요~
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
라우터 네비게이션 가드 질문드려요
안녕하세요 캡틴판교님라우터 네비게이션 가드 강의를 듣다가 next()는 to에서 지정한 url로 이동하기 위한 함수라고 이해했고 위의 next('/login')은 이해가 되는데아래 next()는 to를 어디로 인식하고 이동하게되나요??
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
[질문] $store와 store의 차이
안녕하세요 캡틴판교님 제가 저번에도 질문드린 적이 있는데 이해가 잘안되서 다시 질문드려요강의에서는 import store해서 가져온다음 && store.getters.isLogin으로 사용하는데위와 같이 사용하면 작동이 안되나요??this.$store 도 store안에있는 무언가를 가져오는 코드구문이 아닌가요??store와 $store의 차이를 잘 모르겠어요 너무 궁금합니다.
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
{data} 관련 질문드립니다
안녕하세요 캡틴판교님 강의를 듣던 중 설명해주셨는데 까먹어서 어디서 들었는지 기억이 안나서 질문드려요저기 data를 바로 { }로 묶어서 쓸수있는 이유가 궁금해요개발자뷰안에서 보이는 요청한 data인가요?
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
안녕하세요 401오류 질문드려요
안녕하세요 캡틴판교님 저번주 금요일에 학습노트 게시글 받기까지 된다음 오늘 다시 진행해보니 오류가 떠서 질문드립니다.swagger에서 로그인 후 토큰을 auth해주어서 post한 후에 201코드를 받았는데실제 서버에서 구동해보니 요청 payload는 잘 가는데 401오류와 함께 토큰이 필요하다고 합니다 어떻게 해야할까요?
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
npm run dev 에러
➜ vue-til-server git:(master) ✗ npm i bcrypt npm WARN deprecated bcrypt@3.0.8: versions < v5.0.0 do not handle NUL in passwords properlynpm WARN deprecated node-pre-gyp@0.14.0: Please upgrade to @mapbox/node-pre-gyp: the non-scoped node-pre-gyp package is deprecated and only the @mapbox scoped package will recieve updates in the futurenpm ERR! code 1npm ERR! path /Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/bcryptnpm ERR! command failednpm ERR! command sh -c node-pre-gyp install --fallback-to-buildnpm ERR! CXX(target) Release/obj.target/bcrypt_lib/src/blowfish.onpm ERR! CXX(target) Release/obj.target/bcrypt_lib/src/bcrypt.onpm ERR! CXX(target) Release/obj.target/bcrypt_lib/src/bcrypt_node.onpm ERR! Failed to execute '/opt/homebrew/Cellar/node/19.6.0/bin/node /opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js build --fallback-to-build --module=/Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/bcrypt/lib/binding/bcrypt_lib.node --module_name=bcrypt_lib --module_path=/Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/bcrypt/lib/binding --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v111' (1)npm ERR! node-pre-gyp info it worked if it ends with oknpm ERR! node-pre-gyp info using node-pre-gyp@0.14.0npm ERR! node-pre-gyp info using node@19.6.0 | darwin | arm64npm ERR! node-pre-gyp WARN Using needle for node-pre-gyp https download npm ERR! node-pre-gyp info check checked for "/Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/bcrypt/lib/binding/bcrypt_lib.node" (not found)npm ERR! node-pre-gyp http GET https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v111-darwin-arm64-unknown.tar.gznpm ERR! node-pre-gyp http 404 https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v111-darwin-arm64-unknown.tar.gznpm ERR! node-pre-gyp WARN Tried to download(404): https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v111-darwin-arm64-unknown.tar.gz npm ERR! node-pre-gyp WARN Pre-built binaries not found for bcrypt@3.0.8 and node@19.6.0 (node-v111 ABI, unknown) (falling back to source compile with node-gyp) npm ERR! node-pre-gyp http 404 status code downloading tarball https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v111-darwin-arm64-unknown.tar.gz npm ERR! gyp info it worked if it ends with oknpm ERR! gyp info using node-gyp@9.3.0npm ERR! gyp info using node@19.6.0 | darwin | arm64npm ERR! gyp info ok npm ERR! gyp info it worked if it ends with oknpm ERR! gyp info using node-gyp@9.3.0npm ERR! gyp info using node@19.6.0 | darwin | arm64npm ERR! gyp info find Python using Python version 3.10.10 found at "/opt/homebrew/opt/python@3.10/bin/python3.10"npm ERR! gyp info spawn /opt/homebrew/opt/python@3.10/bin/python3.10npm ERR! gyp info spawn args [npm ERR! gyp info spawn args '/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/gyp/gyp_main.py',npm ERR! gyp info spawn args 'binding.gyp',npm ERR! gyp info spawn args '-f',npm ERR! gyp info spawn args 'make',npm ERR! gyp info spawn args '-I',npm ERR! gyp info spawn args '/Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/bcrypt/build/config.gypi',npm ERR! gyp info spawn args '-I',npm ERR! gyp info spawn args '/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/addon.gypi',npm ERR! gyp info spawn args '-I',npm ERR! gyp info spawn args '/Users/seungwonjang/Library/Caches/node-gyp/19.6.0/include/node/common.gypi',npm ERR! gyp info spawn args '-Dlibrary=shared_library',npm ERR! gyp info spawn args '-Dvisibility=default',npm ERR! gyp info spawn args '-Dnode_root_dir=/Users/seungwonjang/Library/Caches/node-gyp/19.6.0',npm ERR! gyp info spawn args '-Dnode_gyp_dir=/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp',npm ERR! gyp info spawn args '-Dnode_lib_file=/Users/seungwonjang/Library/Caches/node-gyp/19.6.0/<(target_arch)/node.lib',npm ERR! gyp info spawn args '-Dmodule_root_dir=/Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/bcrypt',npm ERR! gyp info spawn args '-Dnode_engine=v8',npm ERR! gyp info spawn args '--depth=.',npm ERR! gyp info spawn args '--no-parallel',npm ERR! gyp info spawn args '--generator-output',npm ERR! gyp info spawn args 'build',npm ERR! gyp info spawn args '-Goutput_dir=.'npm ERR! gyp info spawn args ]npm ERR! gyp info ok npm ERR! gyp info it worked if it ends with oknpm ERR! gyp info using node-gyp@9.3.0npm ERR! gyp info using node@19.6.0 | darwin | arm64npm ERR! gyp info spawn makenpm ERR! gyp info spawn args [ 'BUILDTYPE=Release', '-C', 'build' ]npm ERR! In file included from ../src/bcrypt_node.cc:1:npm ERR! In file included from ../../nan/nan.h:174:npm ERR! ../../nan/nan_callbacks.h:55:23: error: no member named 'AccessorSignature' in namespace 'v8'npm ERR! typedef v8::Local<v8::AccessorSignature> Sig;npm ERR! ~~~~^npm ERR! In file included from ../src/bcrypt_node.cc:1:npm ERR! ../../nan/nan.h:2536:8: error: no matching member function for call to 'SetAccessor'npm ERR! tpl->SetAccessor(npm ERR! ~~~~~^~~~~~~~~~~npm ERR! /Users/seungwonjang/Library/Caches/node-gyp/19.6.0/include/node/v8-template.h:814:8: note: candidate function not viable: no known conversion from 'imp::Sig' (aka 'int') to 'v8::SideEffectType' for 7th argumentnpm ERR! void SetAccessor(npm ERR! ^npm ERR! /Users/seungwonjang/Library/Caches/node-gyp/19.6.0/include/node/v8-template.h:807:8: note: candidate function not viable: no known conversion from 'imp::NativeGetter' (aka 'void (*)(v8::Local<v8::Name>, const v8::PropertyCallbackInfo<v8::Value> &)') to 'v8::AccessorGetterCallback' (aka 'void (*)(Local<v8::String>, const PropertyCallbackInfo<v8::Value> &)') for 2nd argumentnpm ERR! void SetAccessor(npm ERR! ^npm ERR! In file included from ../src/bcrypt_node.cc:1:npm ERR! In file included from ../../nan/nan.h:2884:npm ERR! ../../nan/nan_typedarray_contents.h:34:43: error: no member named 'GetContents' in 'v8::ArrayBuffer'npm ERR! data = static_cast<char*>(buffer->GetContents().Data()) + byte_offset;npm ERR! ~~~~~~~~^npm ERR! 3 errors generated.npm ERR! make: *** [Release/obj.target/bcrypt_lib/src/bcrypt_node.o] Error 1npm ERR! gyp ERR! build error npm ERR! gyp ERR! stack Error: make failed with exit code: 2npm ERR! gyp ERR! stack at ChildProcess.onExit (/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:203:23)npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:512:28)npm ERR! gyp ERR! stack at ChildProcess._handle.onexit (node:internal/child_process:293:12)npm ERR! gyp ERR! System Darwin 22.3.0npm ERR! gyp ERR! command "/opt/homebrew/Cellar/node/19.6.0/bin/node" "/opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "build" "--fallback-to-build" "--module=/Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/bcrypt/lib/binding/bcrypt_lib.node" "--module_name=bcrypt_lib" "--module_path=/Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/bcrypt/lib/binding" "--napi_version=8" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v111"npm ERR! gyp ERR! cwd /Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/bcryptnpm ERR! gyp ERR! node -v v19.6.0npm ERR! gyp ERR! node-gyp -v v9.3.0npm ERR! gyp ERR! not ok npm ERR! node-pre-gyp ERR! build error npm ERR! node-pre-gyp ERR! stack Error: Failed to execute '/opt/homebrew/Cellar/node/19.6.0/bin/node /opt/homebrew/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js build --fallback-to-build --module=/Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/bcrypt/lib/binding/bcrypt_lib.node --module_name=bcrypt_lib --module_path=/Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/bcrypt/lib/binding --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v111' (1)npm ERR! node-pre-gyp ERR! stack at ChildProcess.<anonymous> (/Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/node-pre-gyp/lib/util/compile.js:83:29)npm ERR! node-pre-gyp ERR! stack at ChildProcess.emit (node:events:512:28)npm ERR! node-pre-gyp ERR! stack at maybeClose (node:internal/child_process:1098:16)npm ERR! node-pre-gyp ERR! stack at ChildProcess._handle.onexit (node:internal/child_process:304:5)npm ERR! node-pre-gyp ERR! System Darwin 22.3.0npm ERR! node-pre-gyp ERR! command "/opt/homebrew/Cellar/node/19.6.0/bin/node" "/Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/.bin/node-pre-gyp" "install" "--fallback-to-build"npm ERR! node-pre-gyp ERR! cwd /Users/seungwonjang/Desktop/VUE-ENDGAME/vue-til-server/node_modules/bcryptnpm ERR! node-pre-gyp ERR! node -v v19.6.0npm ERR! node-pre-gyp ERR! node-pre-gyp -v v0.14.0npm ERR! node-pre-gyp ERR! not oknpm ERR! A complete log of this run can be found in:npm ERR! /Users/seungwonjang/.npm/_logs/2023-02-12T15_29_26_893Z-debug-0.log➜ vue-til-server git:(master) ✗ 미치겠습니다..npm i -g @vue/cli는 입력한 상태입니다그뒤로 npm run dev를 입력하면 에러가 나서 npm i bycrypt 를 입력하면 ➜ vue-til-server git:(master) ✗ npm i bycrypt npm ERR! code E404npm ERR! 404 Not Found - GET https://registry.npmjs.org/bycrypt - Not foundnpm ERR! 404 npm ERR! 404 'bycrypt@*' is not in this registry.npm ERR! 404 npm ERR! 404 Note that you can also install from anpm ERR! 404 tarball, folder, http url, or git url.npm ERR! A complete log of this run can be found in:npm ERR! /Users/seungwonjang/.npm/_logs/2023-02-12T15_33_38_306Z-debug-0.log해당 에러가 발생합니다 확인 부탁드립니다
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
혹시 강의 버전과 현재 버전이 달라서 그런건가요?
모달과 리스트 표시할 떄 i 태그안에 클릭이벤트말고 밖에다 span 태그로 감싸줘서 거기에다 click 이벤트를 주닌깐 되네요 그외에는 안되구요 혹시 이건 버전차이 때문일까요? 예시코드 ) <span @click="showModal = false"> <i class="closeModalBtn fas fa-times" ></i> </span>
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
store 관련해서 질문 드립니다.
여기서 사용한 store는 달러를 붙이는데여기서는 안붙이고 사용하는데 이유가 궁금합니다.
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한요청드립니다.
인프런 아이디 : ljh@finenuts.co.kr인프런 이메일 : ljh@finenuts.co.kr깃헙 아이디 : ox043440@gmail.com깃헙 Username : @channy0601권한요청드립니다.