首页 > 解决方案 > 语义 UI - 搜索选项为空白

问题描述

所以我试图弄清楚 Semantic UI 的搜索模块是如何工作的。我一直在一些测试数据上对其进行测试:

const testdata = [
    {
    "id": 7,
    "created_at": "2020-03-24 08:40:42",
    "updated_at": "2020-03-25 10:10:59",
    "name": "NameX",
    "email": "namex@email.no",
    "phone": "94860509"
    },
    {
    "id": 8,
    "created_at": "2020-03-25 10:11:10",
    "updated_at": "2020-03-25 10:11:10",
    "name": "NameY",
    "email": "namey@gmail.com",
    "phone": "94860509"
    },
    {
    "id": 9,
    "created_at": "2020-03-31 15:55:06",
    "updated_at": "2020-03-31 15:55:19",
    "name": "Lucifer",
    "email": "lucifer@gmail.com",
    "phone": "58893177"
    },
    {
    "id": 10,
    "created_at": "2020-03-31 15:55:41",
    "updated_at": "2020-03-31 15:55:41",
    "name": "Morningstar",
    "email": "morningstar@gmail.com",
    "phone": "12345678"
    },
    {
    "id": 11,
    "created_at": "2020-04-01 16:13:39",
    "updated_at": "2020-04-01 16:13:39",
    "name": "Superwhale",
    "email": "superwhale@gmail.com",
    "phone": "18181818"
    }
];

目前,它似乎实际上正在搜索。其中有两个带有“名称”一词的名称 -NameXNameY,它给了我两个结果,问题是这些结果只是空白。[ https://i.imgur.com/O6CcAdc.png][1]

这是搜索元素的配置方式:

$('.ui.search').search({
    source: testdata,
    showNoResults: true,
    ignoreDiacritics: true,
    searchFullText: false,
    searchFields: [
        'name'
    ]
});

我一直在阅读文档,似乎它应该可以工作,但事实并非如此。我错过了一些明显的东西吗?

标签: javascriptjsonsearchsemantic-ui

解决方案


我弄清楚了问题所在。Semantic UI 的搜索模块需要某些键,所以我的等效“名称”必须是“标题”。我通过浏览 JSON 并替换每次出现的

“姓名”:

“标题”:

我尝试使用

fields: {
  title   : 'name'
}

但这由于某种原因不起作用。


推荐阅读