클릭 후 텍스트를 첨부하십시오. 방법?

Question

가 나는 기능이 뷰 소재 (뷰 JS) 태그가

<md-button id="" v-on:click.native="requestSelected(request)"> 


methods: { 

     requestSelected: function(request) { 
      request.accepted = true; 
      console.log(request); 

      var card = document.getElementById('text'); 
      var accept = document.createTextNode("Job selected"); 

      card.appendChild(accept); 

     } 

누군가가 정보를 확인하기 위해 나에게 어떤 뷰 JS documentacion 좀 추천 수, 클릭 한 후 DOM에 텍스트를 추가하기 위해 노력하고있어

당신의 뷰 구성 요소에서

Answer 1

는, 디스플레이 텍스트 데이터 속성을 만들 :

다음

data() { 
    return { 
    displayText: '', 
    } 
} 

, 그냥과 같이 템플릿에 displayText에 대한 참조를 넣어 :

{{ displayText }} 

displayText이 비어 있기 때문에 Vue는 처음에는 아무 것도 표시하지 않으며 displayText이 변경되면 자동으로 DOM을 업데이트합니다.

당신은 너무처럼 requestSelected 방법으로 텍스트를 변경합니다 :

requestSelected: function(request) { 
    request.accepted = true; 
    this.displayText = "Job selected"; 
} 

Here's an example in codepen.