2020-12-15

前两天遇到的问题是关于在e-table中设置e-input，而且el-input中限定了输入的内容的数字，并且是两位保留两位小数。

另外如果是输入10e ， 10. ， 10.1e ， 10.1111e , e11会相应的转化为10 ， 10 ，10.1 , 10.11 , 0

还有就是不能超过表中的一个值，超过了自动设置为0.并且弹窗

解决了的问题：

1.关于小数点的

2.空格的

 测试后没有发现问题，但是代码太多太乱了。明天回公司，看看之前的代码咋写的。。。

<template>
  <div class="container">
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="billMoney" label="支付" width="180">

      </el-table-column>
      <el-table-column prop="sub" label="减免" width="180">
        <template slot-scope="scope">
          <el-input v-model="scope.row.sub" @blur="subblur($event , scope.row)"></el-input>
        </template>
      </el-table-column>
      <el-table-column prop="tip" label="备注">
      </el-table-column>
    </el-table>
    <el-button @click="clickAction"></el-button>
  </div>
</template>
<script>
export default {
  name: "Container",
  data () {
    return {
      beyondDialog: false,
      tableData: [
        {
          billMoney: 10,
          sub: 3,
          tip: '无'
        },
        { billMoney: 20, sub: 3, tip: 'wu' }
      ]
    }
  },
  methods: {
    clickAction () {
      //本来是想用input事件件，这样可以在输入的时候，就能判断如果输入的是字符就不能输入，但是
      console.log(this.tableData);
    },
    subblur (e, row) {
      /**
       * 如果是返回isNaN(e.target.value)返回true的时候，只有一种(数值.数值)的时候是可以选取的，其他情况都是应该是非法的应该设置为0
       * 如果返回的是false，说明可以转化为数值
       * value=value.slice(0,value.indexOf('.')+3)
       */
      if (isNaN(e.target.value)) {
        if (
          /^\d{1,}\.\d{1,2}|^\d{1,}\D{1,}/.test(e.target.value)

        ) {

          if (e.target.value.indexOf(".") > 0) {
            e.target.value = parseFloat(
              e.target.value.slice(0, e.target.value.indexOf(".") + 3)
            );
          } else {
            e.target.value = parseInt(e.target.value);
          }
          if (e.target.value > row.billMoney) {
            alert('222')
            this.beyondDialog = true;
            e.target.value = 0;
          }
        } else {
          e.target.value = 0;
        }
      } else {
        if (e.target.value.indexOf(' ') > -1) e.target.value = 0
        if (e.target.value > row.billMoney) {
          alert('222')
          this.beyondDialog = true;
          e.target.value = 0;
        } else if (!e.target.value) {
          e.target.value = 0;
        } else {
          e.target.value = parseFloat(e.target.value);
        }
      }
      console.log(e.target.value);
    },
  }
}
</script>
<style scoped>
.container {
  padding: 30px;
}
</style>