Question

我无法获取在其事件处理程序中触发事件的html字段（在javascript中为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/element-ui@1.4.0-beta.1/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，请？

由于

Answer 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/element-ui@1.4.0-beta.1/lib/index.js"></script>
<div id="app">
  <template>
    <el-input @input.native="change" placeholder="Input something here"/>
  </template>
</div>

Answer 2

看起来Element UI只是吃掉事件而只返回值。您可以执行的操作是@change(change)而不是@keyup.native(change)，然后您的par参数将是事件而不仅仅是值。

Vue.js + Element UI：在更改时获取“event.target”

2 个答案: