Question

我是Vue JS的新手。在我们的应用中，我们可以验证数据库中是否已存在该值。我想通过使其动态来改进它。因此，我添加了在用户键入任何内容时将data属性放入字段的功能。我在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中的值为空。

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

Answer 1

通过向文本元素添加data属性，可以在vue中获得ref属性的值

<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;

},

Laravel 5：如何使用Vue JS获取data属性中的值

1 个答案: