본문 바로가기

데일리 공부 기록

hands on vue - Vue의 동작원리(어떻게 vue는 반응형인가)

728x90

 

const app = Vue.createApp({
  data() {
    return {
      currentUserInput: '',
      message: 'Vue is great!',
    };
  },
  methods: {
    saveInput(event) {
      this.currentUserInput = event.target.value;
    },
    setText() {
      this.message = this.currentUserInput;
    },
  },
});

app.mount('#app');

// ....

const data = {
  message: 'Hello',
  longMessage: 'Hello! World!',
};
//
const handler = {
  set(target, key, value){
    if(key === 'message'){
      target.longMessage = value + 'World!';
    }
    target.message = value;
  }
};

const proxy = new Proxy(data, handler);

proxy.message = 'Hello!!!!!!';

console.log(proxy.longMessage);

점심시간 다 되어서 이따가 설명작성