个人网页上传网站怎么做,招标网站有哪些,中国建设工程信息网官网查询系统,深圳无间设计场景#xff1a; –要求1#xff1a;输入框只能输入数字#xff0c;可以使正数、负数、0#xff0c;小数点最多保留两位。 –要求2#xff1a;不需要自动补齐小数点#xff0c;也不需要自动四舍五入。 element-ui的数字输入框el-input-number只能满足要求1#xff0c;所… 场景 –要求1输入框只能输入数字可以使正数、负数、0小数点最多保留两位。 –要求2不需要自动补齐小数点也不需要自动四舍五入。 element-ui的数字输入框el-input-number只能满足要求1所以在原有的基础上做修改即可 下图的第一个输入框就是没改动的数字输入框第二个是修改后的满足需求1和需求2 以下代码可以直接复制使用
templatediv!-- 默认数字输入会自动补齐小数点 还会自动四舍五入 --el-input-number v-modelnum5 :precision2 :step0.01 :max10 placeholder0正负数 最多两位小数/el-input-number!-- 去掉加减按钮 去掉自动补齐小数点属性precision 去掉四舍五入 --el-input-number v-modelnum6 :step0.01 placeholder0正负数 最多两位小数 classnum_input input.nativechangeInputPt2($event)/el-input-number/div
/templatescript
export default {data () {return {num5: undefined,num6: undefined}},methods: {changeInputPt2 (e) {console.log(e.target.value)if ((e.target.value.indexOf(.) 0)) {e.target.value e.target.value.substring(0, e.target.value.indexOf(.) 3) // 这里采用截取 既可以限制第三位小数输入 也解决了数字输入框默认四舍五入问题}console.log(e.target.value)}}
}
/scriptstyle langless scoped
.num_input {/deep/.el-input-number__decrease,/deep/.el-input-number__increase {display: none !important;}/deep/.el-input__inner {padding: 0 !important;}
}
/style