语义 ui 搜索无效
Semantic ui search not work
我使用语义 ui,当我在网站上进行搜索时,结果为空,但当我查看控制台时,我看到 json 结果
这是我的js代码
$('.ui.search').search({
apiSettings: {
url: "https://api.github.com/search/repositories?q={query}"
},
fields: {
results: 'items',
title: 'name',
url: 'html_url',
description: 'description'
}
});
和我的 html 代码
<div class="ui right aligned category search item">
<div class="ui transparent icon input">
<input class="prompt" placeholder="Rechercher" type="text">
<i class="search link icon"></i>
</div>
<div class="results"></div>
</div>
screenshot results in my html page
并且我已经尝试了语义的示例-ui 页面
$('.ui.search')
.search({
type : 'category',
minCharacters : 3,
apiSettings : {
onResponse: function(githubResponse) {
var
response = {
results : {}
}
;
// translate GitHub API response to work with search
$.each(githubResponse.items, function(index, item) {
var
language = item.language || 'Unknown',
maxResults = 8
;
if(index >= maxResults) {
return false;
}
// create new language category
if(response.results[language] === undefined) {
response.results[language] = {
name : language,
results : []
};
}
// add result to category
response.results[language].results.push({
title : item.name,
description : item.description,
url : item.html_url
});
});
return response;
},
url: '//api.github.com/search/repositories?q={query}'
}
})
这是行不通的
和你有同样的问题
调试器并得到这个:
debug screenshot
似乎将从响应中获取 'results' 字段,因此如果您的响应没有 'results' 字段,您需要在 onResponse 回调中设置 'results':
apiSettings : {
onResponse (response) {
return {
results: response.myresults
}
}
}
如果你没有设置模板,它会使用标准模板,标准模板使用'title'字段来显示,你需要做一些这样的转换:
response.myresults.forEach((item) => {
item.title = item.name;
})
希望对您有所帮助
我使用语义 ui,当我在网站上进行搜索时,结果为空,但当我查看控制台时,我看到 json 结果
这是我的js代码
$('.ui.search').search({
apiSettings: {
url: "https://api.github.com/search/repositories?q={query}"
},
fields: {
results: 'items',
title: 'name',
url: 'html_url',
description: 'description'
}
});
和我的 html 代码
<div class="ui right aligned category search item">
<div class="ui transparent icon input">
<input class="prompt" placeholder="Rechercher" type="text">
<i class="search link icon"></i>
</div>
<div class="results"></div>
</div>
screenshot results in my html page
并且我已经尝试了语义的示例-ui 页面
$('.ui.search')
.search({
type : 'category',
minCharacters : 3,
apiSettings : {
onResponse: function(githubResponse) {
var
response = {
results : {}
}
;
// translate GitHub API response to work with search
$.each(githubResponse.items, function(index, item) {
var
language = item.language || 'Unknown',
maxResults = 8
;
if(index >= maxResults) {
return false;
}
// create new language category
if(response.results[language] === undefined) {
response.results[language] = {
name : language,
results : []
};
}
// add result to category
response.results[language].results.push({
title : item.name,
description : item.description,
url : item.html_url
});
});
return response;
},
url: '//api.github.com/search/repositories?q={query}'
}
})
这是行不通的
和你有同样的问题
调试器并得到这个: debug screenshot
似乎将从响应中获取 'results' 字段,因此如果您的响应没有 'results' 字段,您需要在 onResponse 回调中设置 'results':
apiSettings : {
onResponse (response) {
return {
results: response.myresults
}
}
}
如果你没有设置模板,它会使用标准模板,标准模板使用'title'字段来显示,你需要做一些这样的转换:
response.myresults.forEach((item) => {
item.title = item.name;
})
希望对您有所帮助