javascript - Vue 3 中的 onKeypress 不捕获数字的最后一个字符

Question

我尝试使用以下代码将输入的数字输入到 Vue 中的函数中。

                     <input 
                        type="number"
                        step="1"
                        class="form-control"
                        placeholder="Enter MyLCI number"
                        required
                        min="1000000"
                        @click.prevent="changeSearch(2)"
                        @keypress="searchLeo"
                        @paste="searchLeo"
                    >

我的功能如下所示。

         searchLeo(e) {
            console.log(e)
            const val = parseInt(e.target.value);
            console.log(val)
         }

当我在输入字段中输入一个数字时，变量“val”的值总是没有我输入的最后一个数字。例如：如果我输入 123，它只显示 12。但是当我从 console.log(e) 输出中检查 event.target.value 时，它​​显示的值为 123。

有人可以请，解释原因。

标签： javascriptformsvue.jsonkeypressonpaste

Answer 1

按键是按下按钮的参考，此时vue没有捕捉到该值。如果您更改为：

<input 
                        type="number"
                        step="1"
                        class="form-control"
                        placeholder="Enter MyLCI number"
                        required
                        min="1000000"
                        @click.prevent="changeSearch(2)"
                        @keyup="searchLeo"
                        @paste="searchLeo"
                    >

您的代码应该可以正常工作，因为当您完成密钥后，vue 已经有了它。