GridJS表格无法搜索三元运算符生成的‘no experience’内容求助

问题原因 #

• 当前搜索逻辑里，第2列（Experiences列）只提取experiences数组中的name字段供搜索匹配。
• 当experiences是空数组时，搜索器拿到的是空数组，而你通过formatter渲染的“no experience”文本不在搜索数据源里，所以搜这个关键词会提示无数据。

解决办法 #

修改search.selector的逻辑，当第2列的experiences为空时，把“no experience”加入搜索匹配项：

search: {
  selector: (cell, rowIndex, cellIndex) => {
    if (cellIndex === 2) {
      // 空数组时返回包含"no experience"的数组，让搜索能匹配到
      return cell.length > 0 ? cell.map(el => el.name) : ['no experience'];
    }
    return cell;
  },
},

另外你原formatter的HTML结构有问题，</ul></b>应该放在三元运算符外面，避免标签闭合错误，修正后的formatter代码：

{
  name: 'Experiences',
  formatter: (experiences) => gridjs.html(`<b style="vertical-align:middle;"><ul class="ps-1 mt-3"> ${
    experiences.length > 0 
      ? experiences.map(experience => `<li><a title="Experience information" href='/experience/show/${experience.id}'>${experience.name}</a></li>`).join('') 
      : "<span class='p-0 mt-3'><u style='color:red'>no experience </u></span>"
  }</ul></b>`)
},

修改后搜索“no experience”就能匹配到对应行，同时HTML结构也更规范。

内容的提问来源于stack exchange，提问作者ghost_of_the_code