elementuitable自增一行如何添加rules

Posted 2023-05-09

依旧是公司里那个Vue+Element UI的项目。今天遇到了一个新的问题：表单中某个选择器的值不同，控制着下面表单内容是否显示。放图：
 

       大概就是这个样子。由后台返回的“发放方式”的数值，控制下面几个input框是否显示。这个实现比较简单，只需要把下面几个框用一个<dev>包裹起来，加上一个v-show=""的判断条件即可，但它们的表单验证让我为难了，因为只看Element UI官网给的方法来看，:rules="rules"只在data下面绑定了一个rules对象，可我这明显需要两套，即如果发放方式为"平台代发"时，只验证一个"发放方式"否则则全部验证。

       花了一点时间摸索，我想：如果不像官方给的那样，rules="rules"，然后在data下设置rules的值，而是把rules绑定一个函数，这个函数在computed计算属性中，根据不同的条件设置不同的验证方法不就可以了？自己尝试了一下，真的成功了，代码如下：

<el-form class="dialog-body" :rules="rulesList" :model="temp">
<!--这里为表单内容-->
</el-form>

<script>
export default
data()
return
rules:
pay_type: [
required: true, message: '不能为空', trigger: 'change'
],
accno: [
required: true, message: '不能为空', trigger: 'blur'
],
accname: [
required: true, message: '不能为空', trigger: 'blur'
],
otp: [
required: true, message: '不能为空', trigger: 'blur'
],
username: [
required: true, message: '不能为空', trigger: 'change'
],
otp_id: [
required: true, message: '不能为空', trigger: 'change'
]
,
rules2:
pay_type: [
required: true, message: '不能为空', trigger: 'change'
]
,

,
computed:
rulesList: function()
if (this.temp.pay_type)
return this.rules
else
return this.rules2


,
登录后复制

    这样就实现了对一个表单进行两套或以上的验证。

    另外一种场景是，给某一个字段添加多条验证规则。由于rules接收的是一个数组，我们在数组中再添加一项即可。

比如下面的例子，我又在后面添加了一条自定义的规则

data()
const validatePass = (rule, value, callback) =>
if (this.option)
callback(new Error('请选择列表中已有的选项'))
else
callback()


return
rules:
firstContract: [
required: true, message: '不能为空', trigger: ['blur', 'change'] ,
required: true, trigger: 'blur', validator: validatePass
],



登录后复制

    自定义规则中，validator接受的是我自定义的一套规则validatePass，Error为接受的错误提示。

 

vue
element
表单验证 参考技术A 由后台返回的“发放方式”的数值，控制下面几个input框是否显示。这个实现比较简单，只需要把下面几个框用一个<dev>包裹起来，加上一个v-show=""的判断条件即可，但它们的表单验证让我为难了，因为只看Element UI官网给的方法来看，:rules="rules"只在data下面绑定了一个rules对象，可我这明显需要两套，即如果发放方式为"平台代发"时，只验证一个"发放方式"否则则全部验证。

mysql如何增加一自增列

参考技术A

首先用Navicat打开我们的数据库，点击打开表视图。



请点击输入图片描述

然后右键点击要设置自增字段的那个表，在弹出菜单上点击‘Design Table’（即表设计）。



请点击输入图片描述

打开表设计视图，点击选中要设置为自增的那个字段。



请点击输入图片描述

然后在下方的设置里，点击勾选上Auto Increment就行了。



请点击输入图片描述

如果要设置自增开始的数字，我们可以点击上方的‘Option’（选项），



请点击输入图片描述

打开后，在Auto Increment的输入框里输入数字就行了，比如输入100，自增字段就是从100开始自增。



请点击输入图片描述

如果没有安装Navicat客户端，我们就只有用sql语句来设置了，

alter table table_name modify id int auto_increment primary key

在这条sql语句里，table_name就是你要设置的具体表名，id就是要设置为自增的那个字段。



请点击输入图片描述