동적 HTML 요소의 Vue 바인드 함수

Question

데이터 테이블을 사용하고 있으며 몇 가지 검사를 기반으로 다른 HTML을 렌더링해야하므로 vue 코드에 jQuery 이벤트가 많이 있습니다. 동적 HTML 요소에 이벤트를 할당 할 수있는 방법이 있는지 궁금합니다.

render:function(data, type, full, meta) { 
    let html = '<div class="catagory-checkbox">' 
     + '<label>' 
     + '<input id="' + data.LeadTrackingId + '" class="statusDetail" type="checkbox" />' 
     + '<span class="cr"><i class="cr-icon glyphicon glyphicon-ok"></i></span>' 
     + '</label>' 
     + '</div>'; 
    if(vm.isSuperAdmin) 
     return html; 

    return ""; 
} 

Answer 1

이 작업을 수행하지 마십시오

내부 데이터 테이블 컬럼 오브젝트. 당신은 문자열 메소드로 html을 만들고 있습니다. 이것은 방법이 아니며 필요가 없습니다. Use template:, not render::-) 귀하의 코드는 위와 같이 보일 것입니다

...

template : ` 
<div v-if"isSuperAdmin" class="catagory-checkbox">' 
    <label> 
     <input :id="LeadTrackingId" class="statusDetail" type="checkbox" />' 
     <span class="cr"><i class="cr-icon glyphicon glyphicon-ok"></i></span> 
    </label> 
</div> 
` 

당신은 같은 ID를 결합 할 수 있지만, 당신이 필요합니까? Good Vue 코드는 html 요소에 ID가 필요하지 않습니다.