事件keyup vueJS答案

【问题标题】：event keyup vueJS事件keyup vueJS
【发布时间】：2020-11-02 11:01:15
【问题描述】：

我正在使用 vueJS 创建一个发泄键，一切正常，我的问题是当我发送控制器中的 URL 参数时为空...

我正在方法.then 中执行 console.log()，我可以看到结果没问题，我想说如果我为我的变量 js 执行 console.log 不响应，则响应为空。 .. 在其他组件 vue 中，我正在做完全相同的事情，一切都很好......我看不到我的错误。

我附上了我的实际代码：

vue 组件

<template>
    <div class="">
        <div class="d-flex">
            <div class="justify-content-center offset-md-3">
                <label for="codigoAsistencia">Código de asistencia.</label>
                <input type="text" id="codigoAsistencia" placeholder="Código" class="form-control">
                <label for="cliente">Cliente.</label>
                <input type="text" v-on:keyup="codigoAsistencia" id="codigoAsistencia" placeholder="Cliente" class="form-control" >
            </div>
            <div class="justify-content-center offset-md-3">
                <label for="fechaInicio">Fecha de inicio.</label>
                <input type="date" id="fechaInicio" placeholder="Fecha Inicio" class="form-control">
                <label for="fechaFin">Fecha fin.</label>
                <input type="date" id="fechaFin" placeholder="Fecha Fin" class="form-control">
            </div>

        </div>

        <div class="d-flex tabla-resultado offset-md-3 mt-3">

            <div class="table-responsive">
                <table class="table">
                    <thead class="thead-dark">
                        <tr>
                            <th>Código</th>
                            <th>Fecha</th>
                            <th>Usuario</th>
                            <th>Estado</th>
                            <th>Tiempo empleado actuación</th>
                        </tr>
                    </thead>
                    <tbody>
                        
                    </tbody>
                   
                </table>
            </div>
        </div>
    </div>
    
</template>

<script>
    

    export default {
        data() {
            return {
                
            };

        },

        methods: {
            codigoAsistencia: function (event) {
                let codigoAsistencia = $("#codigoAsistencia").val();
                let url = "/getAsistenciaCodigo";
                

                axios
                    .get(url, { codigo: codigoAsistencia } )
                    .then((response) => {
                        console.log(response);

                        console.log(codigoAsistencia);

                    })
                    .catch((error) => console.error(error));
            },

            buscarUsuario: function(){
                let url = "/getBonoUsuario";
                axios.get(url)
                        .then((response) => {
                            this.bonosUsuario = response.data;

                            console.log(this.bonosUsuario);
                        });
            },

            
            buscarFecha: function(){
                alert("renovado");
            }
        },
    };
</script>

控制台结果

{data: "", status: 200, statusText: "OK", headers: {…}, config: {…}, …}
app.js:2832 code: 2

【问题讨论】：

标签： javascript php laravel vue.js

【解决方案1】：

你不能像这样传递获取值，试试这个

axios
.get(url, { params: { codigo: codigoAsistencia } })
.then((response) => {
    console.log(response);

    console.log(codigoAsistencia);
})
.catch((error) => console.error(error));

你需要通过params:{}发送获取数据

参考链接https://github.com/axios/axios#note-commonjs-usage

【讨论】：