Vue，在更改事件中获取发件人元素

Question

我只是在学习 VUE，我一直在尝试一些简单的事情，比如获取 @change 事件的发送者元素。我的标记如下所示

<v-text-field label="Takst 1" ref="tarif1Input" v-model="Income.Tariffs[0]" field="@SecurityHelper.SimpleCrypt("CUST_TARIFF1")" @@change="tariffChanged"></v-text-field>

事件是这样安排的：

methods: {
                tariffChanged: function (newVal) {
                    var $s = $(this.$refs.tarif1Input.$el).find('input');
                    var newValue = $s.getValue();

                    $.post('/api/Budget/SaveTariff', {
                        FieldKey: $s.attr('field'),
                        Value: newVal
                    }).done(function () {
                        app.populateIncome();
                    });
                }
}

我设法获取发送元素的唯一方法是使用 refs 并使用它： this.$refs.tarif1Input.$el 但这真的是最好的方法吗？我不能通过函数参数以某种方式获取发送元素。

与在 javascript 中手动连接相比，这似乎真的是倒退了一步；有点像过度使用全局变量。

我正在使用 vuetifyjs。

Answer 1

看看这个fiddlehttps://jsfiddle.net/55e46mn3/4/

<div id="app">
  <input type="text" @change="tariffChange"/>
</div>

const app = new Vue({
    el: '#app',

    methods: {
        tariffChange(event) {
           const inputTarget = event.target;
           console.log(inputTarget.value)
        }
    }
})

Vue，在更改事件中获取发件人元素

Vue, getting sender element on change event

javascript

single-page-application

vuejs2

vuetify.js