v-모델 원리 및 사용자 정의 구성 요소의 실현

970 단어 VUEvuev-modelprops
v-모델을 언급하면 데이터의 양방향 귀속을 생각하지만 그 실현 원리는 무엇일까?
기본 양식에서 다음을 수행합니다.

다음과 같습니다: (input에value 속성 값을 데이터name로 바꾼 다음 input에input 이벤트에input의value 값을 데이터name에 부여합니다.

사용자 정의 구성 요소에서 다음을 수행합니다.
문자열 템플릿에서 상술한 두 번째 방식을 사용하여 v-모델을 실현해야 한다.

{{name}}

Vue.component("test",{
  //props           prop      ,                
  //v-model       input      value、
  //       prop  value
  props:['value'],
  template:`
  `
})

new Vue({
  el:"#demo",
  data:{
    name:"  ",
  },
  methods:{
    ccc:function(){
      this.name = "  ";
    }
  }
})

좋은 웹페이지 즐겨찾기