element输入框怎么让输入的内容转化为数字

直接在v-module后面加点number

<el-form-item label="name" prop="expressCode" required>
 <el-input v-model.number="ruleForm.expressCode"></el-input>
</el-form-item>

这样就可以将输入的字符串转换为数字类型了

element输入框使用正则校验来让input框里面只能输入数字或两位小数的浮点数

substr()方法是用来截取字符串的

语法
strObj.substr(start,length)

start是要截取字符串的开始下标，length是要截取的长度

start 必填，要抽取的子串的起始下标。必须是数值。如果是负数，那么该参数声明从字符串的尾部开始算起的位置。也就是说，-1 指字符串中最后一个字符，-2 指倒数第二个字符，以此类推

可选，子串中的字符数。必须是数值。如果省略了该参数，那么返回从 stringObject 的开始位置到结尾的字串

<!-- v-module绑定的自己的数据 -->
<el-input v-model="moneyInfo.freightAmount"  @keyup.native="moneyInfo.freightAmount =   handleOninput(moneyInfo.freightAmount,'2')"></el-input>
handleOninput(value,type){
  let str = value;
  let len1 = str.substr(0, 1);
  let len2 = str.substr(1, 1);
  //如果第一位是0，第二位不是点，就用数字把点替换掉
  if (str.length > 1 && len1 == 0 && len2 != ".") {
    str = str.substr(1, 1);
  }
  //第一位不能是. ，也不能是 + 或者 —
  if (len1 == ".") {
    str = "";
  }
  if (len1 == "+") {
    str = "";
  }
  if (len1 == "-") {
    str = "";
  }

  //限制只能输入一个小数点
  // 如果返回的下标不等于 -1 那么直接执行if里面的逻辑，定义一个新str去接收 . 以后的字符串，在去indeof，如果还有 . 就执行if里面的逻辑，删掉第二个点
  if (str.indexOf(".") != -1) {
    let str_ = str.substr(str.indexOf(".") + 1);
    if (str_.indexOf(".") != -1) {
      str = str.substr(0, str.indexOf(".") + str_.indexOf(".") + 1);
    }
  }
  //正则替换
  str = str.replace(/[^\d^\.]+/g, ""); // 保留数字和小数点
  if(type == '3'){
    str = str.replace(/^\D*([0-9]\d*\.?\d{0,3})?.*$/, "$1"); // 小数点后只能输 3 位
  }else{
    str = str.replace(/^\D*([0-9]\d*\.?\d{0,2})?.*$/, "$1"); // 小数点后只能输 2 位
  }
  return str;
}

解决两个一样的字符串但就是使用"=="返回false问题

明明是两个一样的字符串但是怎么样都不相等，就很郁闷，后来百度了一下看到一篇文章说可能是因为空格原因，我试了一下还真是，所以这里记录一下

可能是因为返回的数据带有空格，所以会出现这个问题

for (let i = 0; i <shopInfo.length; i++) {
    if (shopInfo[i].name.trim() == shopName.trim()) {
        console.log(111);
    }
}

解决值还未传入但需要调用先写的问题

页面渲染是从template开始，那么值还没有传入的时候，template里面又需要去取，怎么办咧？

比如说对话框，这个框一直在，只是没有显示罢了，但是页面的渲染已经完成，这时还没调用这个对话框，那么也就没有值的传入，如果用 （.） 去取，就会报错，因为是一个 undefined 去 （.）所以会报错

这时我们就可以用三目运算符去做判断，有值才取，没有值就不取

<template>
    <el-dialog title="角色选择">
        // 做一个判断就不会报错了
        {{ rolesList[0]? rolesList[0].roleName : ''  }}
        <div slot="footer" class="dialog-footer">
            <el-button @click="handleClose">取 消</el-button>
            <el-button type="primary" @click="handleClose">确 定</el-button>
        </div>
    </el-dialog>
</template>