I tried to get the entered number in to a function in Vue with the following code.
<input
type="number"
step="1"
class="form-control"
placeholder="Enter MyLCI number"
required
min="1000000"
@click.prevent="changeSearch(2)"
@keypress="searchLeo"
@paste="searchLeo"
>
And my function looks like below.
searchLeo(e) {
console.log(e)
const val = parseInt(e.target.value);
console.log(val)
}
When I type a number in the input field, always the value of the variable "val" comes without the last number I entered. Ex: if I enter 123, it shows only 12. But when I check the event.target.value from console.log(e) output, it shows the value as 123.
Can someone please, explain the reason.
Key press is reference to press the button, and the vue doesnt catch the value at that moment. If you change for:
<input
type="number"
step="1"
class="form-control"
placeholder="Enter MyLCI number"
required
min="1000000"
@click.prevent="changeSearch(2)"
@keyup="searchLeo"
@paste="searchLeo"
>
Your code should works fine, because when you have done the key up, the vue already has it.