uniapp+uview1.0动态表单的校验问题

已于 2022-08-19 11:37:08 修改
阅读量1.7k 收藏 6
点赞数 4
于 2022-08-18 15:10:31 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_70953528/article/details/126406156
版权

Vue 动态校验 联系人输入框 prop 数据验证
关键词由CSDN通过智能技术生成

动态新增联系人的输入框并进行动态校验.

实现效果如下图所示:

 主要代码:

1.修改u-form-Item中的部分代码

2.在使用的页面中prop的写法也有一点点不同

(1)在data中先写校验的内容

(2)点击添加联系人时,将校验的内容放在规则校验里

(3)页面中的prop的写法如下

 然后就可以正常校验啦~

盛夏西瓜汁
关注
  • 4
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
uniapp+uview框架模板
12-03
【uniapp+uview框架模板】是用于快速构建移动应用的开发工具，它结合了uniapp的跨平台能力与uview UI框架的丰富组件库，为开发者提供了高效、便捷的开发体验。uniapp是一个基于Vue.js开发的多端合一的框架，支持H5、...
vue2+uniapp+uview2+i18n的空壳代码文件夹
最新发布
07-02
vue2+uniapp+uview2+i18n的空壳代码文件夹
uview 表单校验， 自定义校验规则， 校验不生效
weixin_45057792的博客
01-05 1020
uview uniapp表单校验，自定义校验规则，校验不生效
uniapp中UView中 u-form表单在v-for循环下如何进行表单校验
weixin_41463944的博客
09-01 5343
uniapp中UView中 u-form表单在v-for循环下如何进行表单校验
uniapp之自定义表单校验。
Anthony_Ccc的博客
06-20 295
uniapp的自定义表单校验。
动态表单：VUE动态表单
08-13
基于vue+Iview实现动态表单组件，通过拖拽组件到面板即可实现一个表单。支持各个组件的动态隐藏显示，动态表格弹窗式维护。
uview下表单动态校验的问题
wxid_mtnujb6ipc0322的博客
04-19 1781
Uview下表单动态校验问题
uview 动态表单校验
kathysnow的博客
02-23 899
【代码】uview 动态表单校验。
解决uview下表单无法动态校验的问题
热门推荐
csdn_zuirenxiao的博客
11-02 1万+
关于uniapp插件uview表单动态校验的一个解决方案
uniapp+uview2精美静态界面
10-28
【uniapp+uview2精美静态界面】是一个基于uniapp框架和uView UI库构建的高质量界面示例项目。uniapp是一个使用Vue.js语法开发的多端应用框架，支持发布到iOS、Android、H5、小程序等多个平台。而uView2则是一个专为...
uniapp+router+uview
11-21
《uniapp+router+uview：构建高效移动应用的基石》 在当今移动互联网时代，开发跨平台的应用已经成为开发者们的日常需求。其中，uniapp、router和uview这三者结合，提供了一种高效且便捷的解决方案。下面，我们将...
微信小程序(uniapp + uView)自定义导航栏
02-29
微信小程序(uniapp + uView)自定义导航栏
vue中iview组件实现表单数据的动态校验
aaa123aaasqw的博客
05-11 1355
【代码】vue中iview组件实现表单数据的动态校验。
uniapp uview 动态表单验证
suimengfeiyang123的博客
10-21 1562
1.uform组件修改代码（u-form.vue） 2.vue 页面form表单批量验证
帮我写一个uview可以动态添加from表单并且是多表单有校验规则的
weixin_42610671的博客
02-09 466
好的，以下是一个使用 uView UI 框架写的 Vue 组件，实现了动态添加 from 表单，并且每个表单都有校验规则。 <template> <div> <u-formref="form" :model="formData" :rules="rules"> <u-form-item v-for="(item, i...
关于uview小程序表单校验不生效问题，以及小程序自定义校验
xiaoxiongxia的博客
07-31 2432
关于uview小程序表单校验不生效问题，以及小程序自定义校验
uniapp动态表单校验 深层对象表单校验 表单不会自动校验 校验第二次失效
weixin_50448781的博客
04-28 2457
代码中我用的是for in 去循环数组的 因为我之前写的动态表单是个对象 前面的索引是从1开始 页面用v-for循环也是从索引 1 开始循环的 介意的话可以全使用foreach 其他 但是用for in 去循环数组也没啥问题 我只是懒得改了；主要的bug就是uniapp这些表单不会自动校验 或者说是不会校验第二次就很恶心，所以我在输入框绑定的两个input和blur事件来处理 算是歪门邪道 但也是解决bug的关键方法；
uniapp+uview搭建环境详细步骤
05-20
搭建 uniapp+uview 的开发环境需要以下步骤： 1. 安装 Node.js 下载并安装 Node.js，可以在官网 https://nodejs.org/en/ 上选择适合自己系统的版本进行下载并安装。 2. 安装 HBuilderX 下载并安装 HBuilderX，可以在官网 https://www.dcloud.io/hbuilderx.html 上选择适合自己系统的版本进行下载并安装。 3. 创建 uniapp 项目 打开 HBuilderX，点击新建项目 -> uni-app -> uni-app 项目，选择项目路径、名称等信息，点击创建。 4. 安装 uview-ui 打开终端或命令行工具，在项目根目录下执行以下命令： ``` npm install uview-ui ``` 5. 引入 uview-ui 在 App.vue 中引入 uview-ui： ``` <style> /* 引入 uview 样式 */ @import "uview-ui/index.scss"; </style> <script> /* 引入 uview 主题配置文件 */ import theme from '@/uview-ui/theme'; export default { mixins: [], onLaunch() { // 设置 uview 主题配置 this.$u.vu.setTheme(theme); } }; </script> ``` 6. 运行项目 在 HBuilderX 中点击运行按钮即可运行项目。 以上就是 uniapp+uview 搭建环境的详细步骤。
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值