低开视图如何实现搜索条件回车搜索?

低开视图如何实现搜索条件回车搜索?

问题描述:

低开视图如何实现搜索条件回车搜索?

解决方案:

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