el-input

:rules=“rules” 驗證必需要加

<el-formref="loginForm":model="loginForm":rules="rules" class="login-form"auto-complete="on"><el-form-item prop="account"><span class="font-container"><i class="iconfont icon-yonghu"></i></span><el-inputname="account"placeholder="賬號"type="text"/></el-form-item><el-form-item label="手機號碼" prop="phone"><el-inputmaxlength="11"placeholder="手機號"name="phone"type="text"></el-input></el-form-item></el-form>

data

data(){return {rules: {account: [{//第一種驗證方式trigger: "blur",validator: (rule, value, callback) => {//中文驗證var reg = /[^\u4e00-\u9fa5]/;if (value === "") {callback(new Error("請輸入賬號"));} else if (!reg.test(value)) {callback(new Error("賬號不能為中文"));} else {callback();}}}],phone: [{//第二種驗證方式required: true,message: "請填寫當前用戶的手機號碼！",trigger: "blur"},{pattern: /^(1[2-9][0-9])\d{8}$/,message: "手機號碼格式不正確！",trigger: "blur"}],} }}常用正則表達式 https://blog.csdn.net/weixin_45161039/article/details/107966869

總結

以上是生活随笔為你收集整理的vue表单验证，中文验证的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。