【工作笔记之element及vue的问题解决记录】

1.思路:vue中的父子组件传值,可以实现父组件的按钮触发某个子组件的显示(比如:表单)

2. 在vue中导入js文件,并要使用里面的函数:
首先引入在js文件:import {A} from 'url'
然后在js文件中导出你要使用的函数A(如果A是主函数,B,C,D函数都被A调用),那么直接在js文件的最下面,函数外导出:export {A}

然后在vue中使用A(param1,param2)即可

3.elementui中自定义表单验证,想要加除了正则以外的,比如某个方法返回的boolean值来确定是否报红框提示,可以利用validator属性
如:
rules:{
                   account:[
                        {  validator: (rule,value,callback) => {this.myFunction(rule,value,callback)}, trigger: 'change' },
                        { required: true, trigger: 'change' }
                    ]}

methods:{
myFunction(rule,value,callback){
if(true){
    callback(new Error());  //这样回调new error就是报红框显示
}else{ 
    callback();
}
}
}

4.在element的自定义表单验证中,如果没有可编辑表格里的,那么表单中的prop="name"要与这个表单v-model里绑定的字段名字要保持一致,否则表单校验获取不到value值

5.element的confim框可以回调,确认和取消 :比如这样:
    v.$confirm(msg1,'warnint msg', {
                                confirmButtonText:.'确认按钮显示文本',
                                cancelButtonText:'确认按钮显示文本',
                                type: 'warning'
                            }).then(action => {
                                if(action === 'confirm'){
                                    //点击确认按钮之后回调执行的操作
                                 
                                }
                            }).catch(err =>{
            // 点击取消或者confirm框的关闭按钮触发的操作
                            })

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
这段代码是一个校验函数,通常用于表单验证的规则中。以下是对代码的解释: 1. `validator: (rule, value, callback) => { ... }`:这是一个函数,接收三个参数:`rule` 是当前校验规则的配置,`value` 是当前表单项的值,`callback` 是一个回调函数用于返回校验结果。 2. `if (this.userInfo.timeOfEntry) { ... }`:这是一个条件判断语句,检查 `this.userInfo.timeOfEntry` 是否存在。 3. `new Date(this.userInfo.timeOfEntry)` 和 `new Date(value)`:这是将日期字符串转换为 JavaScript 的 `Date` 对象。 4. `new Date(this.userInfo.timeOfEntry) > new Date(value)`:这是比较两个日期对象的大小,判断入职时间是否晚于转正时间。 5. `callback(new Error('转正时间不能小于入职时间'))`:如果转正时间小于入职时间,则调用 `callback` 并传递一个带有错误消息的 `Error` 对象。 6. `callback()`:如果校验通过,则调用 `callback`。不传递任何参数表示校验成功。 该校验函数通常用于表单验证的规则配置中,例如使用 Element UI 或其他 UI 框架进行表单验证时。在表单提交或字段值变化时,会触发该校验函数进行相应的校验逻辑。根据校验结果,可以在界面上显示错误提示或执行其他操作。 请注意,上述代码片段中的 `this.userInfo` 表示组件中的一个数据属性,可能是一个包含用户信息的对象。确保在使用该校验函数之前,`this.userInfo` 已经被正确地初始化和赋值。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值