低开视图如何实现搜索条件回车搜索？
问题描述：
低开视图如何实现搜索条件回车搜索？
解决方案：
833及850：
可以通过添加公共方法解决；
1.需要在公共脚本添加以下三个方法；
this.PubApi.handleEnterKey(key)
// 判断是否为回车键 (Enter键的keyCode是13)
if (event.key === 'Enter' || event.keyCode === 13) {
this.Api.conditionChange();
}
this.PubApi.queryAddEventListenerKeydown(conditionSettings)
//过滤出 visible: true 的属性名
const visibleQueryKeyList = Object.keys(conditionSettings).filter(key => conditionSettings[key]
.visible);
this.$nextTick(() => {
for(key of visibleQueryKeyList){
const inputComponent =this.$refs['ref_q_'+ key];
if(inputComponent){
const inputElement = inputComponent.$el?.querySelector('input');
if(inputElement){
inputElement.addEventListener('keydown', this.PubApi.handleEnterKey);
}
}
}
});
this.PubApi.queryRemoveEventListenerKeydown(conditionSettings)
// 防止内存泄漏；移除事件监听removeEventListener
//过滤出 visible: true 的属性名
coonsole.log('销毁--')
const visibleQueryKeyList = Object.keys(conditionSettings).filter(key => conditionSettings[key]
.visible);
for (key of visibleQueryKeyList) {
const inputComponent =this.$refs['ref_q_'+ key];
if(inputComponent){
const inputElement = inputComponent.$el?.querySelector('input');
if(inputElement){
inputElement.removeEventListener('keydown', this.PubApi.handleEnterKey);
}
}
}
2.在视图加载后和视图销毁前添加使用公共方法即可；
视图加载后：
this.PubApi.queryAddEventListenerKeydown(this.conditionSettings)
视图销毁前：
this.PubApi.queryRemoveEventListenerKeydown(conditionSettings)
832：
this.PubApi.handleEnterKey(key)
// 判断是否为回车键 (Enter键的keyCode是13)
if (event.key === 'Enter' || event.keyCode === 13) {
this.Api.doQuery(1);
}
this.PubApi.queryAddEventListenerKeydown(conditionSettings)
//过滤出 visible: true 的属性名
console.log(conditionSettings, 'conditionSettings-add')
const visibleQueryKeyList = Object.keys(conditionSettings).filter(key => conditionSettings[key].visible);
this.$nextTick(() => {
for (const key of visibleQueryKeyList) {
const inputComponent = this.$refs['ref_q_' + key];
if (inputComponent) {
const inputElement = inputComponent.$el?.querySelector('input');
if (inputElement) {
inputElement.addEventListener('keydown', this.PubApi.handleEnterKey);
}
}
}
});
this.PubApi.queryRemoveEventListenerKeydown(conditionSettings)
// 防止内存泄漏；移除事件监听removeEventListener
//过滤出 visible: true 的属性名
console.log('销毁--')
const visibleQueryKeyList = Object.keys(conditionSettings).filter(key => conditionSettings?. [key].visible);
for (const key of visibleQueryKeyList) {
const inputComponent = this.$refs['ref_q_' + key];
if (inputComponent) {
const inputElement = inputComponent.$el?.querySelector('input');
if (inputElement) {
inputElement.removeEventListener('keydown', this.PubApi.handleEnterKey);
}
}
}
更多请参见EOS Low-Code Platform 8