In some projects input Box can only enter numbers , The following methods can be used :

Bind on the label first @input Event to listen for tag value changes , Change the input value through regularization .
<input class="keep_input" v-number-only style="width:35px"
v-model="scope.row.fileOrder" @input="scope.row.fileOrder =
Number($event.target.value.replace(/\D+/, ''))" />
The second part encapsulates a custom instruction on the label !
directives: { numberOnly: { bind: function(el) { el.handler = function() {
el.value = Number(el.value.replace(/\D+/, '')) } el.addEventListener('input',
el.handler) }, unbind: function(el) { el.removeEventListener('input',
el.handler) } } },
Then you can go to the page to see the effect , Only numbers and positive numbers can be entered !

enclosed element of input Style code
.keep_input { -webkit-appearance: none; background-color: #fff;
background-image: none; border-radius: 4px; border: 1px solid #dcdfe6;
-webkit-box-sizing: border-box; box-sizing: border-box; color: #606266;
display: inline-block; font-size: inherit; outline: 0; padding: 0 15px;
-webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); height:
30px; line-height: 30px; text-align: left; } .keep_input:focus { border-color:
#54a6de; outline: 0; }
2022/4/29 newly added , Only normal arrays are allowed such as 1 1.02 -2
numberOnly: { bind: function(el) { el.handler = function() { // el.value =
Number(el.value.replace(/\D+/, '')) const t = el.value.charAt(0) //
Convert to digital form -- Include decimals , negative // First, replace the non numeric ones , Except numbers and . el.value = el.value.replace(/[^\d.]/g,
'') // You must ensure that the first one is a number and not . el.value = el.value.replace(/^\./g, '') //
Only one is guaranteed . Without multiple . el.value = el.value.replace(/\.{2,}/g, '.') //
ensure . Only once , Not more than twice el.value = el.value.replace('.', '$#$').replace(/\./g,
'').replace('$#$', '.') // If the first digit is a minus sign , Allow to add if (t === '-') { el.value = '-' +
el.value } return el.value } el.addEventListener('input', el.handler) },
unbind: function(el) { el.removeEventListener('input', el.handler) } }
More convenient than the above custom instructions Only positive numbers can be entered :
<a-input oninput="value=value.replace(/[^\d]/g,'')" v-model="form.scoreMin" />

Technology
©2019-2020 Toolsou All rights reserved,
Solve in servlet The Chinese output in is a question mark C String function and character function in language MySQL management 35 A small coup optimization Java performance —— Concise article Seven sorting algorithms (java code ) use Ansible Batch deployment SSH Password free login to remote host according to excel generate create Build table SQL sentence Spring Source code series ( sixteen )Spring merge BeanDefinition Principle of Virtual machine installation Linux course What are the common exception classes ?