element input限制只能输入数字

一、效果

目前这个el-input 属性只能输入数字。

二、参考资料以及理解

参考资料

操作思路：

1. oninput：这是一个input 输入框在输入内容时会执行的事件（在输入框输入内容时就会触发 oninput）
2. 对输入框内容进行监听，监听输入内容的格式，这里使用正则进行限制操作
3. blur: 监听输入框失去焦点
4. 当输入框失去焦点时，将输入框中的内容进行保存

操作步骤：

1. oninput="value=value.replace(/^\.+|[^\d.]/g,'')"
2. @blur="salaryChange"
3. function salaryChange() {'这里是本地保存输入框内容的变量' = e.target.value}；

三、源码

html 部分

<template>
	<div>
		<el-form>
      <el-form-item label="资金预算" prop="capitalBudget">
        <el-input
              v-model="dataForm.capitalBudget"
              :disabled="disabled"
              placeholder="资金预算"
              :style=demanwidth
              oninput="value=value.replace(/^\.+|[^\d.]/g,'')"
              @blur="salaryChange"
              ></el-input>
       </el-form-item>
		</el-form>  
	</div>
</template>

js 部分

<script>
methods: {
	salaryChange (e) {
      this.dataForm.capitalBudget = e.target.value
    },
}
</script>