uniapp u-view 弹出匡内加表单验证无法触发的解决方法 u-popup+u-form

码农竟在我身边

于 2021-04-27 14:39:16 发布

阅读量3.9k

点赞数 2

分类专栏： uni-app

本文链接：https://blog.csdn.net/apanpan8126/article/details/116200784

版权

uni-app

uni-app 专栏收录该内容

12 篇文章

订阅专栏

这是一个关于Vue.js的博客，展示了如何创建一个底部弹出的密码修改组件。该组件包含两个输入框用于输入新密码和确认新密码，并有一个提交按钮。在`open_update_pass`方法中，弹窗显示并设置表单验证规则。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

		<u-popup v-model="password_show" mode="bottom">
			<u-form :model="form" ref="uForm">
				<u-form-item label="修改密码:" prop="password" label-width="400rpx;">
					<u-input type='password' v-model="form.password" maxlength='6' />
				</u-form-item>
				<u-form-item label="确认新密码:" prop="check_password" label-width="400rpx;">
					<u-input type='password' v-model="form.check_password" maxlength='6' />
				</u-form-item>
			</u-form>
			<u-button @click="submit">提交</u-button>
		</u-popup>
			open_update_pass(id) {
				this.password_show=true
				this.$nextTick(function(){
					this.$refs.uForm.setRules(this.rules);
				})
			},