技術標籤：Vue

外掛

主要對 name 欄位進行必填驗證，提交事件通過 form-type 繫結

<uni-forms ref="signUpForm" :value="signUpFormData" :rules="rules">
	<uni-forms-item label="" name="username">
		<uni-easyinput type="number" placeholder="請輸入登入手機號碼"
 
 v-model="signUpFormData.username" />
	</uni-forms-item>
	<button form-type="submit" @click="handleSignUp">登入</button>
</uni-forms>

data() {
	return {
		rules: {
			username: {
				rules: [{
					required: true,
					errorMessage: '請輸入註冊手機號碼'
				},{
					validateFunction:function(rule, value, data, callback) {
						let iphoneReg = /^1[0-9]{10}$/
						if (!iphoneReg.test(value)) {
							callback('手機號碼格式不正確，請重新填寫')
						}
						return true
					}
				}]
			}
		}
	}
},
methods: {
	handleSignUp() {
		this.$refs.signUpForm.submit().then(params =>{
			params.code = '95'
			params.uuid = this.signUpFormData.uuid
			this.$SignUp.login(params).then(res => {
				console.log(res, 'res')
				uni.navigateTo({
					url: '/pages/template/news/index'
				})
			})
		})
	}
}
 

validate-trigger 屬性，有倆個屬性值 bind/submit，預設submit，表示只有在點選提交按鈕後，才會進行校驗；bind 是邊輸入邊校驗，只有在輸入正確的格式後才會關掉錯誤提示

<uni-easyinput type="password" placeholder="請輸入登入密碼" v-model="signUpFormData.password" /> 輸入框 type 型別為 password 時表示密碼輸入，密碼會被隱藏掉，右側出現眼睛按鈕