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

问题描述：

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

解决方案：

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