Laravel 5：如何使用vue js获取数据属性中的值

Question

我是 vue js 的新手。 在我们的应用程序中，我们验证该值是否已存在于数据库中。 我想通过使其成为动态来改进它。 因此，每当用户键入任何内容时，我都会将数据属性添加到我的字段中。 我在 mthe data 属性中的值是我将检查该值是否已经存在的表。

添加.vue

<label>Code <span class="required-field">*</span></label>
       <input type="text" name="code" @keyup="checkCOACode" v-model="coa_code" class="form-control" :data-table="chart_of_accounts">

在我的方法中添加.vue

checkCOACode(e) {
    e.preventDefault();
    var code = this.coa_code;
    var x    = event.target.getAttribute('data-table');

    alert(x);
    return false;
    axios.post("/checkIfCodeExists", {code:code})
        .then((response)  =>  {
            var code_checker = '';
            if (response.data == 0) {
                $('.add-chart-of-account').removeAttr('disabled','disabled');

            }else{
                $('.add-chart-of-account').attr('disabled','disabled');
                code_checker    =   'Code is already exist';
            }
            this.coa_checker_result = code_checker;
        });
},

我在 x 中的值是 null。

问题：如何获取数据属性的值？

Answer 1

您可以通过将ref属性添加到文本元素来获取vue中data属性的值

<input type="text" ref="coaCode" name="code" @keyup="checkCOACode" v-model="coa_code" class="form-control" :data-table="chart_of_accounts">

然后得到那个属性

checkCOACode(e) {
    e.preventDefault();
    const coa = this.$refs.coaCode
    const coaCode = coa.dataset.table
    alert(coaCode);
    return false;

},