限制el-input 只能输入包含小数点的数字

原创已于 2022-04-22 16:51:34 修改 · 523 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue #前端 #elementui

于 2022-04-22 16:36:39 首次发布

vue 专栏收录该内容

24 篇文章

订阅专栏

这篇博客介绍了如何在Vue的el-input组件中限制用户只能输入包含小数点的数字。通过使用正则表达式`value=value.replace(/[^d^.]+/g,'')`，可以确保输入值只包含数字和一个小数点。同时提供了不包含小数点的输入限制示例，展示了如何进行前端数据验证。

限制el-input 只能输入包含小数点的数字

<el-input
            v-model.trim="form[item.propName]"
            onkeyup="value=value.replace(/[^\d^\.]+/g,'')"
            :placeholder="item.placeholder"
            clearable
            size="small"
          >
          </el-input>
          <!--  不包含小数点  -->
          <el-input
            v-model.trim="form[item.propName]"
            :placeholder="item.placeholder"
            onkeyup="value=value.replace(/[^\d]/g,'')"
            clearable
            size="small"
            @change="checkInput(item)"
          >
            <span slot="suffix">{{ item.unit }}</span>
          </el-input>