vue2 Vue - reactivity Vue에서 데이터 바인딩을 사용하다 보면 편리하면서도 이게 어떻게 가능한가 싶은 생각이 든다. text라는 변수를 여러 곳에서 사용하더라도 text를 변경하면 그 모든 곳들이 자동으로 변경되니 말이다. 보통 상식에는 text가 변경되어도 다른 값들은 이미 계산된 결과를 들고 있기 때문에 영향을 받지 않는다. 결국 어디선가 다시 계산을 유도시켜야 하는데 이를 reactivity(반응형)이라고 한다. 다행히 javascript에는 이를 깔끔히 해결해주는 Object.defineProperty라는 문법이 존재한다. defineProperty에서 특정 object의 getter와 setter를 override 시킬 수 있다. 그러면 관찰하고자 하는 변수와(x), 그 변수를 사용하는 다른 변수(y)들의 gette.. 2021. 5. 16. Vue - 양방향 바인딩 vue js를 소개하는 가장 대표적인 기능이 양방향 데이터 바인딩이다. 공식 홈페이지 첫 화면에 대문짝만 하게 보여주는 progressive framework 취지에 맞게 낮은 진입장벽으로 일부분만 vue로 적용해 갈 수 있는데, vue로 바꿔나갈 때 당장 사용할 수 있는 기능이기 때문인 것 같다. 고수준의 양방향 데이터 바인딩을 하기 전에 html과 데이터 사이를 연결시키는 저수준의 문법부터 먼저 적용해보자. 단순히 vue 인스턴스의 데이터에 text라는 변수를 선언하면 html에서 사용할 수 있다. script에 있는 데이터를 html에서 사용하도록 바인딩한 것이다. {{ text }} 그럼 반대로 html에서 text라는 변수를 업데이트하기 위해 input 태그를 추가해보자. 아래 사용하는 v-bi.. 2021. 5. 15. 이전 1 다음
