簡體   English   中英

Javascript - 如何在 Vue.js 中搜索大寫或小寫?

[英]Javascript - How to search no matter upperCase or lowercase in Vue.js?

我正在使用 Vue.js 3,在這里我搜索了數據,但這些數據來自假 API。 所以這個搜索只適用於小字符或大字符,但我想搜索大寫或小寫的拋出數據? 這是我的代碼

<template>
  <div class='home'>
      <h1>Third</h1>
      <div v-if="error"> {{error}} </div>
      <div v-if="posts.length">
         <input type="text" v-model.trim="search" />
         <!-- <p>search term - {{search}}</p> -->
          <div v-for="post in matchingNames" :key='post.id'>
            <h3>{{post.title }}</h3>
            <h1>{{post.id}}</h1>
          </div>
      </div>
    <div v-else> Loading...</div>
  </div>
</template>

<script>
import { computed, ref, watch, watchEffect} from 'vue'
// import Listing from '../components/Listing.vue' 
import getPosts from '../composables/getPosts'

export default {
    name:'Third',
    components: {} ,
    setup(){ 

      const search = ref('')

      const{posts,error,load} = getPosts()

      load()

      const matchingNames = computed (()=> {  
      return posts.value.filter((post)=>post.title.match(search.value)) 
    })
     

      return {posts, error, search, matchingNames}
    }
}
</script>

<style>

</style>

我也嘗試用包含 js 方法替換 match 方法,但結果是一樣的

這是現在如何工作的 gif,任何人都可以幫助我我是 Vue.js 的新手 3

在此處輸入圖像描述

首先將兩者都轉換為小寫:)

...
return posts.value.filter((post)=>post.title.toLowerCase().includes(search.value.toLowerCase()))
...

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM