선배님들 Vue.js watch에서 감지해서 props, data 값을 바꿔도 렌더링이 안 바뀝니다

Question

안녕하세요 선배님들제목 그대로부모에서 값을 바꿔서자식 watch로 감지는 성공하고바뀐 props값을 data로 set했는데 렌더링이 안 바뀌네요..props도 바꾸고data도 바꾸고method까지 실행해봤는데 렌더링이 새로 안 그려집니다너무 곤란한 상황이라 도움주시면 감사하겠습니다..

yeori · Accepted Answer

vue devtool 보시면 props 로 전달받은 변수가 잘 바뀌었는지 확인할 수 있습니다. 거기 보면 다 나옵니다.도구 사용법을 익히세요.도구 사용법을 익히세요.도구 사용법을 익히세요.도구 사용법을 익히세요.

yeori · Answer

this.pager 안에는 totalCnt 변수가 안보이는데 watch가 실행되도 코드가 안할테고, 폰이라 쓰기도 힘드네...암튼 개발도구를 보셈다 나옴

개발자라서햄볶아요 · Answer

개발 도구를 보면 다 나옵니다!!!!!!!!!!!!

인성 절구로 빻음 · Answer

<!DOCTYPE html> <html> <header> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> </header> <body> <div id="app"> <my-component :cnt="cnt"></my-component> <button @click="inc()"> 버튼 - {{cnt}} </button> </div> </body> <script> const app = new Vue({ el: `#app`, components: { 'my-component': { template: `<p>child - cnt: {{ cnt }} / totalCnt: {{ totalCnt }}</p>`, props: ['cnt'], data: function () { return { totalCnt: 0 } }, watch: { cnt: function (newVal, oldVal) { // watch it this.totalCnt = newVal } } } }, data: function () { return { cnt: 0 } }, methods: { inc() { this.cnt = this.cnt + 1 } } }) </script> </html>

선배님들 Vue.js watch에서 감지해서 props, data 값을 바꿔도 렌더링이 안 바뀝니다

4개의 답변

Q&A 목록