입력 제안 입력 상자 요소-UI는 구덩이를 강화

붙이 구덩이 문제 설명 :

하나의 문제 :

아무 것도 보이지 않았다, 백 엔드 배열의 반환 때 입력 상자에 입력 콜백 초점 후 결과로 전달 된 배열을 얻으려면, 단지 전체 빈 상자가 아닙니다.


문제 해결 방법 :
나는 그것이 콜백 데이터 형식으로 전달 생각이 문제가 잘못된 것입니다. 요소 공식 라인은 이렇게 기록 :

나는 객체의 배열, 아무 문제입니다 통과했다.
그럼 난 관련 정보의 발견에 추천 검색어 입력 상자 데모 코드와 액세스 할 수있는 Elemen의 t을 읽을 만 추천 목록에서 데이터 입력
데이터 : 값 필드 []에! ! !

그래서, 나는 백 엔드 처리 응답에 반환하고, 현장의 필요에 응답의 구성 보여 {값을 '추천을 입력'}이 형식에서, 문제가 해결된다.

searchAppNodeApi (SEARCHQUERY) 그 때는 (대응 => {
            .loadAll = response.data
            .devEuiArr = []
           에 대해 (아이템하자 {)를 .loadAll
              .devEuiArr.push을 ({ "VALUE1" : item.dev_eui} ) 
          } 
        })

searchAppNodeApi () API 방법은 내 요청의 뒷면 끝, 응답 콜백 함수 매개 변수 요청이 성공적으로 얻을. 그러나, 나는 필드가 필요하지 않습니다 많이 포함 응답, 나는 그냥 dev_eui 필드가 필요합니다. 새로운 배열 devEuiArr로 선언 형식 푸시 : 따라서, 각각의 사이클이되는 dev_eui의 response.data가 { '입력 제안'값} 재결합.

다음과 같이 인쇄입니다 :

 

 

다음과 같이 올바른 결과는 다음과 같습니다

 

 

 

 

질문 2 :

당신이 입력 한 후 그것이 내가 제안 목록을 입력받을 때, 다른 입력에 제안 목록을 전환 할 수 있다는 것입니다, 제안의 목록, 새로운 문제의 출현을 성공적으로 나타나고, 데모 코드 요소 공식 웹 사이트는이 상황을 해결하지 않고, 처음에 번쩍한다 데이터 배열 도움이되지 않는다 : 상기 스위칭 입력이 또한 추천 목록 심지어 수동 빈 콜백 ([] 데이터)를 플래시 후 추천 일람이 표시 입력, 입력리스트는 비어있다.


문제 해결 방법 :
나는 데이터 데이터 같은 수동 빈 콜백 내부의 배열을 반환 할 필요라고 생각이 문제 :

 // 트리거 예측 
      querySearch (queryString이, 콜백) {
         var에 결과 = queryString이? 은이 .devEuiArr.filter ( 다음은이 .createFilter (queryString이)) : 다음은이 .devEuiArr
         // 권장 반환 데이터의 콜백 목록 전화 
        콜백 (결과) 
        결과 = ' 
      }

그러나, 나는이 요소 공식 웹 사이트의 작은 구석에 이러한 매개 변수를 발견 캐시 변수와는 아무 상관이없는 역할을 재생되지 않았다

 

debounce ? 函数去抖 그것? 일해야합니다!

debounce 디폴트 값은 300ms를, 우리가 에선 0ms로 설정합니다.

<el- 자동 완성 
          자리 = "请输入DEVEUI" 
          V -Model = "searchDeveuiVal" 
          지울 
          : 페치 -suggestions = "querySearch" 
          사이즈 = "작은" 
          : 바운스 = 0 
          @ keyup.enter.native = "searchAppNode"> 
 </ 엘 -autocomplete>

 

 

 



추천

출처www.cnblogs.com/yanl55555/p/12543987.html