vue 前端验证两位小数

记录下自己踩的坑

// 校验规则

    let validatorPrice = (rule, value, callback) => {

      if (!value) return callback(new Error('请输入数字'))

      if (!Number(value)) return callback(new Error('请输入数字值'))

      // let reg = /^(([1-9]{1}\d*)|(0{1}))(\.\d{0,2})$/g; //小数限制0-2位

      // let reg = /((^[1-9]\d*)|^0)(\.\d{0,2}){0,1}$/;

      let reg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/

      if (!reg.test(value)) return callback(new Error('请输入正确数值'));

      callback();

    };

使用方式:

 rules: {

}

money: [

          { validator: validatorPrice, message: '请输入正确的数字,可保留两位小数', trigg: 'blur' }],

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 要在 Vue3 中保留两位小数,你可以使用 JavaScript 中的内置方法 `toFixed()`。例如,如果你有一个变量 `price`,你可以在模板中使用以下方式将其保留两位小数: ``` {{ price.toFixed(2) }} ``` 这将会输出 `price` 的值并保留两位小数。 ### 回答2: 在Vue3中,我们可以使用内置的过滤器或者计算属性来保留小数。 首先,我们可以使用内置的过滤器`toFixed`来保留小数位数。在模板中,我们可以通过在需要保留小数的数字后面加上`|`符号,并紧跟着过滤器的名称来使用它。例如,如果我们有一个数值`num`,我们想要保留两位小数,可以这样写:`{{ num | toFixed(2) }}`。这将会将`num`保留为两位小数并在页面上显示。 另外,我们也可以使用计算属性来实现保留小数。我们可以在组件的计算属性中定义一个新的属性,该属性通过调用JavaScript的`toFixed`方法来保留小数位数。例如,我们可以这样写: ```javascript computed: { formattedNum() { return this.num.toFixed(2); } } ``` 然后,在模板中,我们可以使用`formattedNum`来代替原始的`num`,这样就能保留两位小数了。 总结起来,Vue3中保留两位小数可以使用内置的过滤器`toFixed`或者通过计算属性使用JavaScript的`toFixed`方法来实现。这些方法都可以让我们在页面上显示保留特定小数位数的数值。 ### 回答3: 在Vue3中,我们可以使用内置的`toFixed`方法来保留指定位数的小数。该方法返回一个字符串,表示将数字四舍五入到指定的小数位数。 例如,如果我们有一个名为`number`的变量,其值为3.1415926。要保留两位小数,我们可以使用以下代码: ```javascript <template> <div> {{ number.toFixed(2) }} </div> </template> <script> export default { data() { return { number: 3.1415926 } } } </script> ``` 在上述代码中,我们将`number`变量的值设置为3.1415926,并在模板中使用`toFixed`方法来将其保留两位小数。最终,模板将显示3.14。 需要注意的是,`toFixed`方法将返回一个字符串,而不是一个数值类型。如果需要将其转换为数值类型,可以使用`parseFloat`或`Number`方法进行转换: ```javascript <template> <div> {{ parseFloat(number.toFixed(2)) }} </div> </template> ``` 上述代码中的`parseFloat`用于将字符串转换为浮点数,使我们可以进行后续的计算或操作。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值