檢查搜索字符串的大寫和小寫

Question

當用戶將輸入輸入到搜索框時，我希望它檢查該字符串是否可用並顯示它。 目前，它只顯示大寫到大寫和小寫到小寫匹配的結果。 但我想同時匹配字符串大寫和小寫。 示例：假設我們正在搜索 TopLeader。 當用戶輸入 top 時，它不會顯示結果，但是當用戶鍵入 Top 時，TopLeader 結果會顯示。 我想要當用戶搜索頂部或 TOP 時仍然會顯示結果。

這是我的代碼模板：

<tbody>
  <tr v-for="item in filteredData" :key="item.id">
    <FLM :flm="item.flm" :flmCode="item.flm_code" />
  </tr>
</tbody>

腳本：

data() {
return {
  worksheet: [],
  search: "",
};
},
computed: {
filteredData: function () {
  return this.worksheet.filter((result) => {
    console.log(result);
    return result.NSM.match(this.search);
  });
},
},
mounted() {
fetch("http://localhost:3000/worksheet")
  .then((response) => response.json())
  .then((data) => (this.worksheet = data))
  .catch((err) => console.log(err.msg));
  },

Answer 1

我不確定我是否很好地滿足了您的期望，但如果我做到了，我會說您可以將search字符串轉換為 RegExp，並向其傳遞一個不區分大小寫的參數

  return this.worksheet.filter((result) => {
    return result.NSM.match(new RegExp(this.search, 'i'));
  });

Answer 2

“i”正則表達式標志完成這項工作。 例子：

 [ "top", "Top", "TOP", "topo" ].map((input) => { console.log(`${input} => ${RegExp(input, "i").test("TopModel")}`) })