el-input格式化

El-Input组件可以通过设置属性`format`来实现格式化。具体步骤如下：

1. 在`el-input`中设置`v-model`来绑定输入框的值。

2. 设置`format`属性为一个函数，该函数会在输入框的值改变时触发。

3. 在`format`函数中对输入框的值进行格式化并返回格式化后的值，最后将该值赋给`v-model`绑定的变量。

例如，我们想将输入框中的手机号码格式化为`xxx-xxxx-xxxx`的形式，可以按照如下方式操作：

<template>
  <el-input v-model="phoneNumber" :format="formatPhoneNumber"></el-input>
</template>

<script>
export default {
  data() {
    return {
      phoneNumber: ''
    }
  },
  methods: {
    formatPhoneNumber(value) {
      // 去除空格和横杠
      value = value.replace(/\s|-/g, '')
      // 将手机号码格式化为 xxx-xxxx-xxxx
      const reg = /^(\d{3})(\d{4})(\d{4})$/
      return value.replace(reg, '$1-$2-$3')
    }
  }
}
</script>

在上面的代码中，我们首先在`el-input`中设置`v-model`来绑定输入框的值，然后设置`format`属性为一个函数`formatPhoneNumber`，该函数会在输入框的值改变时触发。在`formatPhoneNumber`函数中，我们先使用正则表达式去除输入框中的空格和横杠，然后再将手机号码格式化为`xxx-xxxx-xxxx`的形式。最后，将格式化后的值返回并赋给`v-model`绑定的变量`phoneNumber`。这样，当用户在输入框中输入手机号码时，输入框中的值就会自动被格式化为`xxx-xxxx-xxxx`的形式。