2017-12-18 11 views
2

이벤트 처리기에서 이벤트를 발생시키는 HTML 필드를 가져올 수 없습니다 (자바 스크립트는 event.target).Vue.js + Element UI : 변경시 "event.target"가져 오기

내가 가진 폼했습니다 : 변경 이벤트에 함수에 연결

  • 입력 요소를

내 코드는 다음과 같다 변경 이벤트를 관리하는 기능 :

var Main = { 
 
    methods: { 
 
     change(par) { 
 
     console.log("The value is: " + par); 
 
     //HERE I can't get "event.target" 
 
     } 
 
    } 
 
}; 
 
var Ctor = Vue.extend(Main) 
 
new Ctor().$mount('#app')
<script src="//unpkg.com/vue/dist/vue.js"></script> 
 
<script src="//unpkg.com/[email protected]/lib/index.js"></script> 
 
<div id="app"> 
 
    <template> 
 
    <el-input @change="change" placeholder="Input something here"/> 
 
    </template> 
 
</div>

저는 다른 함수를 호출 할 수 있다는 것을 알고 있습니다. 그리고 각각 하나에서 나는 상대적인 입력이 누구인지 알지만 일반적인 것을 사용하고 싶습니다. 내가 element-ui.common.js에서 이벤트 화재의 코드를 본 스택 트레이스 다음

:

handleChange: function handleChange(event) { 
    this.$emit('change', event.target.value); 
}, 

그리고 이벤트 핸들러가 element 패스 단지 값.
어쨌든, 어떤 아이디어가 event.target을 얻으시겠습니까? 그것은 요소 UI처럼 보이는

감사

답변

1

사용할 수 @ input.native

var Main = { 
 
    methods: { 
 
     change(event) { 
 
     console.log("The value is: " + event.target.value); 
 
     //HERE I can't get "event.target" 
 
     } 
 
    } 
 
}; 
 
var Ctor = Vue.extend(Main) 
 
new Ctor().$mount('#app')
<script src="//unpkg.com/vue/dist/vue.js"></script> 
 
<script src="//unpkg.com/[email protected]/lib/index.js"></script> 
 
<div id="app"> 
 
    <template> 
 
    <el-input @input.native="change" placeholder="Input something here"/> 
 
    </template> 
 
</div>

1

는 이벤트를 먹는 만 값을 반환합니다. @change(change) 대신 수행 할 수있는 것은 @keyup.native(change)이고 그 다음에 par 매개 변수가 값이 아닌 이벤트가됩니다.