Laravel 5: Как получить значение в атрибуте данных, используя vue js

Question

Я новичок в Vue JS. В нашем приложении у нас есть проверка, если это значение уже существует в базе данных. Я хочу улучшить его, сделав его динамичным. Поэтому я добавил атрибут данных в поле, когда пользователь вводит что-либо. Мое значение в атрибуте mthe - это таблица, в которой я проверю, существует ли это значение.

Add.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">

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

},