在使用uniapp开发过程中,遇到cuihai-combox这个插件无法使用失去焦点事件 有经验的大佬麻烦指点一下怎么使失去焦点事件生效 插件地址:https://ext.dcloud.net.cn/plugin?id=3756#rating 代码如下: [Java] 纯文本查看 复制代码 // 部门下拉数据源 candidates: ['部门1', '部门2', '部门3', '部门4'], // 获取弹出框选择的部门 getValue(e) { console.log(e); }, 部门, 大佬
组件未对失去焦点事件做任何操作,改一下组件的源码,自己补充一个方法。 文件cuihai-combox.vue,第235行左右,onBlur 方法 [Python] 纯文本查看 复制代码onBlur() { this.$emit('xxx', this.selectValue()) },
demonw 发表于 2023-5-17 10:28 组件未对失去焦点事件做任何操作,改一下组件的源码,自己补充一个方法。 文件cuihai-combox.vue,第2 ... 我这边是加了这个方法,是去除防止一直弹窗关不掉的,加了你说的那句还是不行,你有具体示例吗 [Java] 纯文本查看 复制代码onBlur() { setTimeout(() => { this.showSelector = false; }, 50) }
空心人i 发表于 2023-5-17 10:46 我这边是加了这个方法,是去除防止一直弹窗关不掉的,加了你说的那句还是不行,你有具体示例吗 [mw_shl_ ... 这样写没啥问题啊 [Python] 纯文本查看 复制代码onBlur() { setTimeout(() => { //关闭弹窗 this.showSelector = false //传递选中值到父组件方法getValue this.$emit('getValue', this.selectValue()); }, 50) },
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; }
demonw 发表于 2023-5-17 10:59 这样写没啥问题啊 [mw_shl_code=python,true]onBlur() { setTimeout(() => { 大佬,这个是我的那个组件代码,按照你说的加了会报错,烦请再指点一下
空心人i 发表于 2023-5-17 11:11 大佬,这个是我的那个组件代码,按照你说的加了会报错,烦请再指点一下 这边是可以正常运行的,你先检查一下代码,是不是多或少了标点符号之类的,把错误提示发一下也行
demonw 发表于 2023-5-17 11:21 这边是可以正常运行的,你先检查一下代码,是不是多或少了标点符号之类的,把错误提示发一下也行 大佬,可能是我表述的有问题,脑袋犯迷糊了,我的意思是用我刚才发的那个组件,在我执行下面的代码的时候,我想在我的代码里再写个@blur不生效,能调整一下生效吗[Java] 纯文本查看 复制代码 @bulr="onBlur1" // 部门下拉数据源 candidates: ['部门1', '部门2', '部门3', '部门4'], // 获取弹出框选择的部门 getValue(e) { console.log(e); },