Element-ui 对输入框进行限制

154 阅读1分钟

vue2.x + element-ui 对输入进行一定的限制,包括正整数,不能输入回车空格,手机号等

限制只能输入正整数

<template>
  <sp-input
    v-model.trim="params.storded"
    maxlength="4"
    placeholder="请输入优先级,数值越小优先级越高"
    class="input-width"
    oninput="value=value.replace(/[^\d]/g, '')" />
</template>

限制不能输入回车空格

<template>
  <sp-input
    v-model.trim="params.flowDesc"
    class="input-width"
    type="textarea"
    placeholder="请输入"
    maxlength="100"
    show-word-limit
    oninput="value=value.replace(/\n/g, '')"
  >
</template>

element input 限制只能输入手机号

<sp-form-item label="资源手机号" prop="customerPhone">
  <sp-input
    v-model.number="params.customerPhone"
    clearable
    placeholder="请输入资源手机号"
    class="wd-input"
    maxlength="11"
    oninput="value = value.replace(/[^\d]/g, '')" />
</sp-form-item>

或者

<sp-form-item label="资源手机号" prop="customerPhone">
  <sp-input
    v-model.number="params.customerPhone"
    clearable
    placeholder="请输入资源手机号"
    class="wd-input"
    maxlength="11"
    @input="val => params.customerPhone = val.replace(/[^\d]/g, '')" />
</sp-form-item>