Vue 3 中的 onKeypress 不捕获数字的最后一个字符答案

【问题标题】：onKeypress in Vue 3 doesn't capture the last character of numberVue 3 中的 onKeypress 不捕获数字的最后一个字符
【发布时间】：2021-10-04 10:22:02
【问题描述】：

我尝试使用以下代码将输入的数字输入到 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。

谁能解释一下原因。

【问题讨论】：

您的代码没有意义 - 您将整个事件对象传递给 parseInt
如果你想在输入值改变时做一些事情，你可以使用@input事件来监听。这样，您也可以删除 @paste 事件。
这是我的错误 Michal。我更正了。

标签： javascript forms vue.js onkeypress onpaste

【解决方案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 已经有了它。

【讨论】：

它有效。谢谢！
@KasunSampathWeligamage 不客气！