el-form使用时踩坑

最新推荐文章于 2024-06-11 18:41:27 发布
最新推荐文章于 2024-06-11 18:41:27 发布
阅读量251 收藏
点赞数 1
分类专栏： 前端 UI组件库 html 文章标签： html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42931285/article/details/124090121
版权
前端 同时被 3 个专栏收录
372 篇文章 13 订阅
订阅专栏
html
46 篇文章 1 订阅
订阅专栏
UI组件库
18 篇文章 0 订阅
订阅专栏
在Vue中，表单数据通常使用`model`进行双向绑定，而非`v-model`。`el-form-item`的`prop`属性应与`form`和`rules`中的属性名保持一致，以确保表单验证正常工作。如果属性名不匹配，会导致验证失效，影响表单的正确操作。
摘要由CSDN通过智能技术生成
  • 绑定表单数据用的是model,而不是v-model；在这里插入图片描述
    el-form-item中的propd=“region”，这里的prop要和fom和rules中的属性名保持一致。否则表单检验不生效。
    在这里插入图片描述
_处女座程序员的日常
关注
专栏目录
el-form-item不显示报错$option；label和input不是行内样式显示；el-form表单校验不生效；el-form表单校验正则
killerdoubie的博客
02-27 1209
el-form-item不显示报错$option;label和input不是同行显示；el-form表单校验不生效；el-form表单校验正则
element-ui的form表单校验踩坑
weixin_47783830的博客
08-21 1220
今天查看项目，发现了一个小小的bug，之前从来没注意过，记录下。 管理系统的修改跟增加功能用的同一个表单，只是通过判断显示不同的内容。而修改时跟增加时的验证也不一样，由此，出现了一些奇怪的事情，先看看代码： 这是我改完之后故意写错的问题： <el-form :ref="fuleCalorificForm" :rules="rules" label="left" :model="fuleCalorificForm" la
[Vue warn]: Unknown custom element: ＜el-form＞ - did you register the component correctly? For recurs
DSs1206的博客
12-30 2550
这里说引入文件有问题 但是如果引入的文件自己感觉没有问题的时候 我提供一种可能 ！！！！！！代码千万别这样写 import { Button, Form, FormItem, Input } from 'element-ui' Vue.use(Button, Form, FormItem, Input) ！！！！！！规范点 一个个引入组件！！！！ md找半天报错 import Vue from 'vue' import { Button } from 'element-ui' impor..
el-form表单报错
凡尘
05-08 188
el-form表单报错
el-element 表单校验对象类型提示 ‘ ‘ is not a string
weixin_43882265的博客
08-01 4547
Element表单验证rules整理](https//blog.csdn.net/weixin_49431999/article/details/109721425)其实该下拉框中已经有值了，只是值的类型是对象，所以报错提示nodeisnotastring。标志要使用的validator的数据类型为object（对象）类型。......
基于vue-cli@4 使用element-ui栅格布局时出现Unknown custom element: ＜el-row＞的解决方案
Cheryl的加工厂
09-11 2937
原因是没有注册组件了 解决办法：打开入口文件main.js，添加以下代码： import ElementUI from 'element-ui'; Vue.component(ElementUI); /* 或写为 * Vue.use(ElementUI) */
element-plus el-form二次封装记录
weixin_64160020的博客
03-01 1879
---------------------------------------------------------分割线--------------------------------------------------------------:在父组件中的子组件标签上绑定ref值,且将其声明为ref响应式变量,此后就可以使用 变量名.value.子组件属性名 来获取子组件中的属性和方法.需要注意的是:子组件中的属性和方法必须通过defineExpose暴露父组件才能获取。
elementUI-表单验证踩坑记录
青阳的博客
12-12 422
简单表单验证： :model必须是对象，否则报错。 <el-form-item prop="shareTitle">中的prop必须和<el-input>这个的v-model一致否则不能验证。 <el-form :model="jcData" ref="activeInfo" :rules="rules"> <el-form-item prop="shareTitle"> <el-input
elementUI_el-radio踩坑_设置点击事件会触发两次
qq_43260366的博客
08-15 4179
chooseIdClick方法无需执行两次，仅需要在input点击时触发即可；当运行时，点击按钮，发现chooseIdClick方法执行了两次；我发现elementUI的el-radio标签在封装过程中是这样的。使用了elementUI的单选按钮，点击按钮时对数据进行校验。方法是添加在label标签上的；所以用户点击之后的执行是这样的。......
el-form中：model
08-16
例如，示例中的el-form标签上使用了:model="form"，其中form是一个对象，包含了与表单元素的v-model属性相对应的属性（如name、gender、age）。这样，在用户输入时，表单元素的值会自动更新到form对象中，而form对象...
vue3 element-plus 动态设置el-button类型，npm run dev项目正常，npm run build失败
jdjfjgfdgdfg的博客
03-24 2547
“vue”: “^3.2.16”, “vite”: “^2.6.4”, “element-plus”: “^2.1.4”, 以下程序可以正常执行，但是npm run build失败 <template> <el-button :type="typeBtn">sfsdfsdf</el-button> </template> <script lang="ts" setup> const typeBtn = ref('info'); </sc
TypeScript项目的问题-第三方包报类型兼容错误
qq_40574071的博客
05-07 1万+
在nuxt项目中，引用了AntV包，1.0.3版本时报了这样子的错误 ERROR ERROR in /Users/***/Desktop/AJK/_fe/jiahzuang/node_modules/@antv/g2plot/lib/plots/pie/component/label/base-label.d.ts(17,18): ...
编辑时使用Object.assign({},row) el-form表单无法编辑 el-select赋值后不能编辑
新前端小白的博客
08-13 9345
场景：页面表格数据是从后台获取的，编辑时，将数据传给dialog，发现Form表单无法编辑了，select多选框无法选择，删除，datepicker等组件也会出现这种不能编辑的情况 原因：通过Object.assign直接将后台返回的数据赋值给form，后台返回的数据结构与data中初始化的form，数据结构发生了改变 解决： 页面有新增，编辑，删除按钮。 可以编辑表格中的某行数据，点击编辑打开d...
Unknown custom element: ＜el-button＞ - did you register the component correctly?
weixin_48002230的博客
03-14 2193
【代码】Unknown custom element: ＜el-button＞ - did you register the component correctly?
【el-form+vue-treeselect】vue表单验证树形结构+填写时返回unknown
栀妹儿的炼丹炉
03-23 2696
使用vue-treeselect 1、安装依赖 npm install --save @riophae/vue-treeselect 2、页面使用 <template> <div> <treeselect v-model="value" :options="options" placeholder="请选择"/> </div> </template> import TreeselectView from "@riophae/v
解决IDEA中element-ui标签没有代码提示问题
热门推荐
qq_51226378的博客
01-04 1万+
解决IDEA中element-ui标签没有代码提示问题
vue3按需引入element-plus遇到的问题
qq_34498806的博客
07-26 1743
vue3按需引入element-plus遇到的问题
关于column中的property值为undefined
最新发布
weixin_56561648的博客
06-11 227
我遇到的情况是因为<el-table-column />标签中未绑定prop的值，所以在我想要拿到这个数据名的时候出现undefined。在我做项目的过程中，因为要获取单元格内的值，所以需要通过property来获取当前选中的单元格数据名。所以遇到了这个错误。
Vue中Button按钮基础用法及参数属性
Tiuntel
01-30 9607
Vue中Button按钮基础用法及参数属性
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值