시맨틱 UI 검색 사용자 정의 데이터 소스

Question

API 질문은 여기에 있습니다. 시맨틱 UI가 제공하는 search (자동 완성) 모듈을 사용하려고합니다. API를 보면 데이터 비동기를로드하는 사용자 지정 함수와 함께 API를 사용하는 방법을 찾지 못하는 것 같습니다. 내가 찾은 모든 예제는 고정 URL 사용 : 나는 구글이 API를 배치하여이 구성 요소를 사용하려고 해요

$('.ui.search').search({ 
    apiSettings: { 
    url: '//api.github.com/search/repositories?q={query}' 
    } 
}); 

을 (geocode, 당신이 다음 볼 것은 내가 쉽게 사용하기 위해 쓴 얇은 약속 래퍼입니다) . 나는 docs의 "행동"부분에 따라이 일을 시도 :

$searchComponent.search({ 
    source: [], 
    onSearchQuery(query) { 
    // cancel original behaviour 
    $searchComponent.search('cancel query'); 
    geocode({ input: query }).then(results => { 
     // build suggestions 
     const suggestions = results.map(place => ({ title: place.description })); 
     // generate results for the newly created suggestions 
     $searchComponent.search('generate results', suggestions); 
     // finally show the autocomplete panel 
     $searchComponent.search('show results'); 
    }) 
    }, 
}) 

를하지만의 .search(method) 통화에 대해 아무것도 취소/생성하지 않는 것/쇼는 아무것도하지 않는 것. 내가 뭔가 잘못하고 있는거야?

Answer 1

글쎄, 너무 명확하지 않았다, 그러나 여기있다 :

$searchComponent.api({ 
    responseAsync(settings, callback) { 
    const query = settings.urlData.query; 
    // make sure to transform result to an acceptable format 
    asyncRequest(results => callback(result)); 
    } 
}).search({ /* other config, like searchDelay */ }) 

Answer 2

그냥 경우에 누군가가 여기 완전히 (계단식 검색의 경우처럼) 결과를 추가 지정하고자하는 토지, 여기 방법 내 경우

$searchComponent.search('add results', 
    $searchComponent.search('generate results', { results: <<results>> }) 
); 

, 나는 onSelect에서 결과의 두 번째 레벨을 설정했다 : 그렇게합니다.