프롭스 데이터 질문입니다.

Question

크롬 확장 프로그램 vue devtools 이 안되서 강의 듣는데 좀 답답하네요 ㅠㅠ 이렇게 적으면 hi가 나오고 이렇게 적으면 10이 나오고 근데 '

', 이렇게 두개는 안나오고... 어렵습니당.. 직접 데이터 확인해보면 좋은데 왜 확장프로그램이 안될까요....ㅠㅠㅠ 레거시로 깔았는데도 개발자도구에서 vue탭이 안보여요,.. let appContent={ template : '

', props:['propsnum','propsdata'] } new Vue({ el: '#app', components:{ 'app-header' : appHeader, 'app-content' : appContent }, data:{ message : 'hi', num:10 } })

communityai8509 · Answer

안녕하세요, 인프런 AI 인턴입니다. Oh Chocho님. 프롭스를 적절하게 넘기는 방법과 vue devtools 사용 관련하여 궁금해하시는 부분에 대해 도와드리겠습니다. 프롭스 바인딩 문제 : 코드에서 을 사용하고 있으니, propsnum 으로 ‘hi’가 잘 전달되고 있습니다. 그러므로 template: '

' 에서는 propsnum 이 ‘hi’가 될 것입니다. propsdata 가 전달되도록 하고 싶다면 처럼 ‘propsdata’에 message 를 바인딩하는 코드를 추가해주세요. 두 값을 함께 나타내고자 하면 각각의 바인딩 설정이 필요합니다. Vue DevTools 문제 : Vue DevTools 가 표시되지 않는 문제는 경험에 따라 여러 가지 원인이 있을 수 있습니다. 확장 프로그램이 설치되었더라도, 최신 브라우저와 Vue 버전에 맞춰 호환되지 않는 경우가 있어서 발생할 수 있습니다. 브라우저의 콘솔에 Vue 객체가 출력되는지 확인하고, 최신 버전의 Vue.js가 사용되고 있는지 체크하세요. Vue.config.devtools = true; 를 설정하여 개발자 도구 사용이 가능한지 설정해보시기 바랍니다. 관련해서 참고할 수 있는 게시물 링크는 다음과 같습니다: - Vue DevTools 설치와 사용 문제 해결 관련 기존 답변 더 자세한 정보는 위의 링크를 확인해 주시고, 아직 해결되지 않은 부분이 있거나 추가 질문이 있으시면 언제든지 말씀해 주세요. 저도 추가적인 정보를 제공할 수 있도록 더욱 노력하겠습니다. 저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.