前端大佬看过来,uniapp的cuihai-combox的失去焦点事件

查看 101|回复 9
作者:空心人i   
在使用uniapp开发过程中,遇到cuihai-combox这个插件无法使用失去焦点事件
有经验的大佬麻烦指点一下怎么使失去焦点事件生效
插件地址:https://ext.dcloud.net.cn/plugin?id=3756#rating
代码如下:
[Java] 纯文本查看 复制代码
// 部门下拉数据源
                                candidates: ['部门1', '部门2', '部门3', '部门4'],
// 获取弹出框选择的部门
                        getValue(e) {
                                console.log(e);
                        },

部门, 大佬

Takitooru   

是否这样??
   
        
        
            
            
        
   
demonw   

组件未对失去焦点事件做任何操作,改一下组件的源码,自己补充一个方法。
文件cuihai-combox.vue,第235行左右,onBlur 方法
[Python] 纯文本查看 复制代码onBlur() {
    this.$emit('xxx', this.selectValue())
},
空心人i
OP
  


demonw 发表于 2023-5-17 10:28
组件未对失去焦点事件做任何操作,改一下组件的源码,自己补充一个方法。
文件cuihai-combox.vue,第2 ...

我这边是加了这个方法,是去除防止一直弹窗关不掉的,加了你说的那句还是不行,你有具体示例吗
[Java] 纯文本查看 复制代码onBlur() {
                                setTimeout(() => {
                                        this.showSelector = false;
                                }, 50)
                        }
空心人i
OP
  


Takitooru 发表于 2023-5-17 10:19
是否这样??
[md]```

大佬,不是这样的,我想在失去焦点的时候拿到这行的值,并且操作,你这个是选中之后的吧
demonw   


空心人i 发表于 2023-5-17 10:46
我这边是加了这个方法,是去除防止一直弹窗关不掉的,加了你说的那句还是不行,你有具体示例吗
[mw_shl_ ...

这样写没啥问题啊
[Python] 纯文本查看 复制代码onBlur() {
        setTimeout(() => {
                //关闭弹窗
            this.showSelector = false
//传递选中值到父组件方法getValue
                this.$emit('getValue', this.selectValue());
        }, 50)
},
空心人i
OP
  


demonw 发表于 2023-5-17 10:59
这样写没啥问题啊
[Python] 纯文本查看 复制代码onBlur() {
        setTimeout(() => {
[/quote]大佬,这个是我的那个组件代码,按照你说的加了会报错,烦请再指点一下
[mw_shl_code=java,true]
        
               
                        {{label}}
               
               
                        
                        
                        
                        
                        
                                
                                       
                                                {{emptyTips}}
                                       
                                       
                                                {{isJSON?item[keyName]:item}}
                                       
                                
                        
               
        
        .uni-combox {
                /* #ifndef APP-NVUE */
                display: flex;
                /* #endif */
                height: 40px;
                flex-direction: row;
                align-items: center;
                /* border-bottom: solid 1px #DDDDDD; */
        }
        .uni-combox__label {
                font-size: 16px;
                line-height: 22px;
                padding-right: 10px;
                color: #536277;
        }
        .uni-combox__input-box {
                position: relative;
                /* #ifndef APP-NVUE */
                display: flex;
                /* #endif */
                flex: 1;
                flex-direction: row;
                align-items: center;
        }
        .uni-combox__input {
                flex: 1;
                font-size: 15px;
                height: 22px;
                line-height: 22px;
        }
        .uni-combox__input-arrow {
                padding: 10px;
        }
        .uni-combox__selector {
                box-sizing: border-box;
                position: absolute;
                top: 42px;
                left: 0;
                width: 100%;
                background-color: #FFFFFF;
                border-radius: 6px;
                box-shadow: #DDDDDD 4px 4px 8px, #DDDDDD -4px -4px 8px;
                z-index: 2;
        }
        .uni-combox__selector-scroll {
                max-height: 200px;
                box-sizing: border-box;
        }
        .uni-combox__selector::before {
                content: '';
                position: absolute;
                width: 0;
                height: 0;
                border-bottom: solid 6px #FFFFFF;
                border-right: solid 6px transparent;
                border-left: solid 6px transparent;
                left: 50%;
                top: -6px;
                margin-left: -6px;
        }
        .uni-combox__selector-empty,
        .uni-combox__selector-item {
                /* #ifdef APP-NVUE */
                display: flex;
                /* #endif */
                line-height: 36px;
                font-size: 14px;
                text-align: center;
                border-bottom: solid 1px #DDDDDD;
                /* margin: 0px 10px; */
        }
        .uni-combox__selector-empty:last-child,
        .uni-combox__selector-item:last-child {
                border-bottom: none;
        }
空心人i
OP
  


demonw 发表于 2023-5-17 10:59
这样写没啥问题啊
[mw_shl_code=python,true]onBlur() {
        setTimeout(() => {

大佬,这个是我的那个组件代码,按照你说的加了会报错,烦请再指点一下
demonw   


空心人i 发表于 2023-5-17 11:11
大佬,这个是我的那个组件代码,按照你说的加了会报错,烦请再指点一下

这边是可以正常运行的,你先检查一下代码,是不是多或少了标点符号之类的,把错误提示发一下也行
空心人i
OP
  


demonw 发表于 2023-5-17 11:21
这边是可以正常运行的,你先检查一下代码,是不是多或少了标点符号之类的,把错误提示发一下也行

大佬,可能是我表述的有问题,脑袋犯迷糊了,我的意思是用我刚才发的那个组件,在我执行下面的代码的时候,我想在我的代码里再写个@blur不生效,能调整一下生效吗[Java] 纯文本查看 复制代码
@bulr="onBlur1"

// 部门下拉数据源
                candidates: ['部门1', '部门2', '部门3', '部门4'],

// 获取弹出框选择的部门
            getValue(e) {
                console.log(e);
            },
您需要登录后才可以回帖 登录 | 立即注册