묻고 답해요
158만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결Vue.js 시작하기 - Age of Vue.js
npm run serve
vue cli 강의를 듣고 이해가 되지 않아서 다시 돌아와서 듣고 있습니다. 그런데 처음 강의 들었을 때, cd vue-cli 입력 후, npm run serve로 서버를 띄우고 app.vue에서 template, script, style태그 안에 수업대로 코딩을 하면 수업에 있는 화면대로 app이 출력이 되었는데요, 두 번째 들었을 때 다시 서버를 띄우고 app.vue를 작성했을 때에는 app이 출력이 되지 않고 'welcome to your vue.js app' 화면 그대로 유지 됩니다. 어떻게 해결을 해야할까요?
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
git권한요청드립니다.
인프런 아이디 : sung7074(구글로그인)인프런 이메일 : sung7074@gmail.com깃헙 아이디 : sung7074@gmail.com깃헙 Username : sung7074 으로 아직 권한이 없어 사이트 접근이 안되고 있습니다. 확인 부탁드립니다.
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
질문이 있습니다.
1. 리스트를 순서대로 1, 2, 3, 4로 추가 한 뒤, 페이지를 새로고침 하면 2,4,1,3 으로 순서가 변경되어서 나타납니다. 어떤 이슈가 있는 것인가요? 2. 리스트에 1을 추가한 뒤, 다시 또 1을 추가하면 Duplicate keys detected 에러가 나타납니다. 이부분은 어떻게 해결해야 할까요?
-
해결됨[2021] 요즘 누가 유료로 웹서비스 구축하나, 파이어베이스의 모든 것 - Vue.js
v-lazy-image 오류에 관해 문의 드립니다.
안녕하세요 데이비드 선생님 수업을 수강하게 된 학생입니다. 금일 유용한 Vue 3rd part 모듈소개의 v-lazy-image 부분을 진행하는데 오류가 발생하였는데, 제가 미흡하여 오류의 원인을 파악할 수 없어서 문의드립니다. 영상에서는 약 13분부터 입니다. import VLazyImage from "v-lazy-image"; 를 추가하고 cmd 를 통해 yarn run serve 실행하는데 이미지와 같은 오류가 발생하였습니다. 웹 화면상에도 이미지가 나타나지 않습니다. 혹시 가능하시다면 해당 오류의 원인을 알 수 있을까요? 부탁드립니다. 강의 잘 보고 있습니다. 감사합니다.
-
미해결Vue-Django-Bootstrap 뚝딱 블로그
소스요청
안녕하세요. 제공되는 자료(소스)가 전체에 대한 내용인데, 중간 단계의 소스를 받을 수 있는지요? ('확장파트 전 단계'인 'Vue-Django API 개발 (II)'까지만 포함하는 소스)
-
해결됨웹 게임을 만들며 배우는 Vue
브라우저에 아무것도 표시가 되지 않습니다.
강좌 코드랑 똑같고, 버전도 webpack4, vue2.6, compiler도 2.6 등등 다 맞춰줬는데도 화면엔 아무것도 그려주지 않아서 당황스럽네요. visual studio code 쓰고 있고, live server (port 5500) 사용한게 문제가 된걸려나요??
-
미해결Vue.js 시작하기 - Age of Vue.js
root 컴포넌트에서 undefined로 받습니다.
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 선생님 안녕하세요. 제가 진행한 부분은 root 컴포넌트에 데이터를 event발생하여 전달하는 부분까지 진행했습니다. app-content에서는 num = 10이 잘 등록되었는데, 버튼 이벤트를 발생할 때는 root 컴포넌트에는 undefined로 인식하여 이 값을 대입하는 현상이 있습니다. 오타도 안 난 듯 한데.. 어디서 문제인지 갑이 잡히지 않습니다. ㅠㅠ 에러 : Property or method is not defined on the instance but referenced during render 소스 : <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- Vue 외부 스크립트 호출 --> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <title>Document</title> </head> <body> <div id="app"> <app-header></app-header> <app-content v-on:pass="resultNum(value)"></app-content> </div> <script> Vue.config.devtools = true; // 개발도구 사용여부(이건 제가 별도로 찾아서 적용했습니다.) var appHeader = { template: '<div>header</div>' }; var appContent = { // passNum 이라는 버튼을 클릭했을 때 appHeader로 데이터를 전달하는 방법 // → Root 컴포넌트로 event 발생시키고 appHeader로 props 전달한다. // 이때 Root 컴포넌트에서 하위 컴포넌트로 props를 실행하려면 데이터를 선언해야 한다. template: '<div>content' + '<button v-on:click="passNum">header로 전달</button>' + '</div>', methods: { passNum: function() { this.$emit('pass', 10); } } }; // root 컴포넌트 new Vue({ el: '#app', components: { 'app-header': appHeader, 'app-content': appContent }, data: { num: 0 }, methods: { resultNum: function(value) { // num 받기 this.num = value; } } }); </script> </body> </html>
-
미해결Nuxt.js 시작하기
nuxt.js 초기 세팅시 폴더 구조가 강의와 다르게 구성됩니다
프로젝트 생성시의 설정값을 강의에서와 동일하게 했는데, 말씀하신 것과 폴더구조가 다르게 설정되고 있습니다. (프로젝트 이름을 동일하게 설정하고 설치해도 저렇게 폴더구조가 잡힙니다) npm run dev를 실행하면 첫 화면도 강의와 다르게 나오고 layouts, middleware, plugins와 같은 폴더가 빠졌는데 create-nuxt-app 버전이 강의에서는 v3.6.0이고 지금 설치하면 v3.7.1으로 나오는데 버전이 달라지면서 생기는 차이인걸까요?
-
해결됨Vue.js 끝장내기 - 실무에 필요한 모든 것
전역 axios설정 문의
안녕하세요 강사님 좋은 강의 언제나 감사드립니다. 강사님의 강의 덕분에 기존 jsp를 뷰로 전환을 성공적으로 적용할 수 있었습니다. 다만 한 가지 여쭤보고 싶은 점이 있는데, axios를 사용하게 될 시에, 만일 뷰의 컴포넌트 하나가 로딩될 때 자식 컴포넌트 3개를 import해서 해당 자식 컴포넌트의 created시점에 api를 호출하도록 설정을 했는데, 이 경우에 서버에서 토큰 만료가 되었음을 리턴받게 되었을 때 나머지 api들을 요청 취소 할 수 있는 방법은 없을까요? 아니면 제가 아키텍쳐 설계를 잘못한 걸까요? 자식 컴포넌트는 단순 prop으로 데이터 전달 받아서 동작할 뿐, 컴포넌트에서 api를 호출 하지 않는 방식으로 가야 할까요? 혹시 강사님은 실제 프로젝트를 하실때 해당 이슈에 대해 어떻게 처리하시는 지 궁금합니다. 단순히 제가 생각했을때는 위에 이야기 한 것 처럼 컴포넌트에서는 api를 날리지 않고 부모 컴포넌트에서 코드를 async await로 api여러개 조회 후 try catch문으로 에러가 발생하면 그 이후 코드는 실행하지 않도록 한 뒤 자식 컴포넌트에게 데이터를 prop으로 넘겨주는 방식밖에 생각이 나지 않는데 제 생각이 잘못되었거니 더 좋은 방법이 있는 것인지 궁금합니다.
-
해결됨Vue.js 시작하기 - Age of Vue.js
윈도우에서 Vue cli 터미널 에러뜨시는 분들 여기보세요
이거보고 해결했습니다.https://singa-korean.tistory.com/21
-
해결됨Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
toggleOneItem 내부 index매개변수 오류문제..
안녕하세요 판교님!강의 들으면서 열심히 따라가고 있습니다 다른게 아니라 처음 소스 작업할때부터 계속 발생한 오류문제인데 어떻게 해결해야될지 몰라서 질문드리는데요.. toggleOneItem: function(todoItem, index) { todoItem.completed = !todoItem.completed; localStorage.removeItem(todoItem.item); localStorage.setItem(todoItem.item, JSON.stringify(todoItem)); }, 이부분에 index매개변수때문에'index' is defined but never used no-unused-vars이라고 오류가 발생하는데 원인을 잘 모르겠습니다..index를 제거하면 작동이 잘되고 아니면 서버를 계속 종료시켰다가 다시 돌리면 오류없이 작동이 되더군요.. index를 제거하는게 좋을까요??
-
해결됨Vue.js 시작하기 - Age of Vue.js
mode 에 history 를 넣었더니, anchor 가 /login 으로 변합니다.
해쉬를 없애기 위해서 다음과 같이 작성하였습니다. var router = new VueRouter({ mode: 'history', // 페이지의 라우팅 정보 routes: [ // 페이지의 개수만큼 객체 개수가 필요하다. { // 페이지의 url path: '/login', // 해당 url 에서 표시될 컴포넌트 component: LoginComponent }, { path: '/main', component: MainComponent } ] }); 그런데 링크가 .../original/path/to/login, .../original/path/to/main 이 되는 것이 아니라 /login, /main 으로 변해버립니다. (앞의 기존 path 가 사라져서 router.html 파일이 아닌 login, main 이라는 존재하지 않는 파일에 접근하게 됩니다.) 따로 서버를 띄운 것은 없고 크롬 브라우저에서 실행하였습니다. 무슨 실수를 한 것일까요? ㅠㅠ
-
해결됨Vue로 Nodebird SNS 만들기
[해결] v.trim()을 사용하면 해당 property를 읽을 수 없다고 하는데요~
아래 질문과 동일한 질문인데.. 이렇게 뜨는데... 혹시 다른 걸로 대체할 수 있는 방법이 있을까요? 음 해결했습니다.. 좀 이상하긴 한데 변수값?이 v가 아니기만 하면 되는 거 같아요.. v 를 text로 바꾸니까 에러 없이 잘 동작합니다. (참고로 기존 에러에서는 서버는 동작하는데 해당 에러가 title에 뜨고, 박스에 입력 자체가 불가능했습니다. 검색해봤는데 이유는 모르겠네요... )
-
미해결Vue.js 시작하기 - Age of Vue.js
안녕하세요! 4/10 Live방송 때 router-view 관련한 질문드린 학생입니다!
안녕하세요! 캡틴판교님 :) 4/10 Live방송때 router-view관련해서 질문드리고 답변받았던 학생입니다! 다름이 아니라 캡틴판교님 말씀대로 오탈자와 router를 정의한 부분들(path나 component)을 살펴봤을 때 별 다른 문제는 없으나 아직 제대로 동작하지 않습니다.ㅠ 또한 캡틴판교 블로그의 '질문을 잘하는 개발자'글을 읽고 제가 처한 상황을 명확히 알려드려야 질문을 받는 입장에서도 편할거 같다고 생각해서 다시 질문드립니다! :) 1. 개발환경: 에디터는 VS코드를 사용하고 있고, npm으로 vue-cli를 설치해서 vue init webpack-simple로 프로젝트를 만들었으며, npm run dev를 통해서 개발하고 있는 내용을 확인하고 있습니다. 2. 문제상황: 싱글파일컴포넌트를 사용해서 컴포넌트들을 분리했으며, router에 관한 파일도 router.js로 따로 만들어서 main.js에서 import해서 사용했습니다. npm run dev를 통해서 실행시 console과 cmd창에서 모두 오류가 발생하지 않고 동작됩니다. 다만 App.vue의 template부분에 router-view를 통해서(5.참고) 나타내고 싶은 부분이 있는데 그 부분이 표시되지 않습니다.(7.참고) nav부분에서 router-link를 통해서 URL을 변경하는 부분을 구현했는데(6.참고) 해당 부분은 잘 동작됩니다. 실행된 웹에서 해당 버튼을 누르면 알맞게 URL이 /, /menu2, /menu3 ...으로 변경됩니다. (다만 Section컴포넌트가 뜨지 않는 것은 동일) 3. 다음은 router.js 내용입니다. 4. 다음은 main.js 내용입니다. 5. 다음은 App.vue 내용입니다. 6. 다음은 PlandNav.vue 내용입니다. 7. 다음은 실제로 동작하는 웹화면과 개발자도구에서 확인한 실제 렌더링 결과입니다. (footer내용은 가렸습니다!) 위의 사진과 같이 router-view를 통해서 나타내고 싶은 PlandSection1~4부분이 알맞게 렌더링되지 않고 <!---->로 표현됩니다 :( 혹시 제가 실수한 부분이나 발견하지 못한 오류가 있나요?? 제가 구글링하면서 찾은 제 문제와 가장 가깝다고 생각되는 문서입니다. https://stackoverflow.com/questions/60238731/vue-router-showing-blank-page-when-built https://router.vuejs.org/guide/essentials/history-mode.html
-
해결됨Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
Destructuring 을 배웠었나요...?
제가 입문부터 강의를 보고 있습니다. 지금 강의를 보면 Destructuring 을 말씀하셨다고 하셨는데.. 어느 강의에서 말씀하셨었나요..? 참고 URL 외엔 설명된 부분이 없는 것 같아서요.. 참고 URL 주신 사이트를 보면 context 처럼 response 를 인자로 무조건? 당연하게 받기 때문에 context.commit => { commit } response.data => { data } 로 표현한게 맞을까요?? 제가 이해한 부분이 맞는 지... 궁금해서 문의합니다.
-
미해결Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
이제는 자동링크가 모두 되는것 같아요.
파스칼, 케밥 모두 링크로 연결되어보여지는데 파스칼 유지해도 좋은것 인가요?
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃허브 권한 요청드립니다~
인프런 아이디 : itsonlyreport@gmail.com인프런 이메일 : itsonlyreport@gmail.com깃헙 아이디 : itsonlyreport@gmail.com깃헙 Username : itsonlyreport 입니다. 감사합니다~
-
미해결Vue.js 시작하기 - Age of Vue.js
data 객체 안 객체에서 this 사용하기
vue-cli에서 data에 이중객체 구조로 만들 때 this가 통하지 않는데 이럴땐 어떻게 해야하나요? 아래의 그림은 data의 chartData 객체에서 label 값으로 computed의 tagNames를 사용하려고 한 부분인데요, chartData가 이미 객체라서 그런지 this를 하면 뷰 인스턴스를 가리키지 않는 것 같습니다. 그래서 tagNames도 사용이 안되구요.
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
github 권한설정 다시 부탁드립니다.
인프런 아이디 : lar8224@gmail.com인프런 이메일 : lar8224@gmail.com깃헙 아이디 : lar8224@gmail.com깃헙 Username : lahreum 늦게 확인했더니 기간 만료라고 하네요.. 다시 권한 추가 부탁드립니다...
-
미해결Vue.js 시작하기 - Age of Vue.js
질문backend.js:1414 Uncaught (in promise) TypeError: Cannot set property '__VUE_DEVTOOLS_UID__' of null at registerAppJob (backend.js:1414)
TypeError: Cannot set property '__VUE_DEVTOOLS_UID__' of null backend.js:1414 Uncaught (in promise) TypeError: Cannot set property '__VUE_DEVTOOLS_UID__' of null at registerAppJob (backend.js:1414) 도움이 필요합니다.