我有一个组件，本质上是一个输入/选择混合字段，它允许用户在输入字段中键入内容，并根据查询从下拉列表中选择项目。
它在我试过的大多数设备上都能很好地工作，也就是说，当用户在输入字段中键入内容时，项目列表会更新，只显示包含该字符串的项目。
除了我的安卓设备上的Chrome浏览器--当你输入时，列表似乎没有更新，除非我按下"空格键"。非常奇怪。有人知道为什么会这样吗？
下面是<script setup>中的代码：

const props = defineProps([ 'items', 'searchBy' ])
const searchTerm = ref('')

const itemsToShow = computed(() => {
    if (props.items) {
      if (searchTerm.value) {
        return props.items.filter(el => {
          if (props.searchBy) {
            return el[props.searchBy].toUpperCase().indexOf(searchTerm.value.toUpperCase()) > -1  
          }

          return el.toUpperCase().indexOf(searchTerm.value.toUpperCase()) > -1
        })
      } else {
        return props.items
      }
    } else {
      return []
    }
})

以及HTML：

<input 
      type="text" 
      class="input"
      v-model="searchTerm"
      placeholder=" " 
    />
    <div class="items-list">
      <div 
        v-for="item in itemsToShow" 
        :key="item" 
        @click="() => handleAdd(item)" 
        class="item text"
      >
        {{ item }}
      </div>
      <div 
        v-if="!itemsToShow.length" 
        class="text"
      >
        No items match searched term
      </div>
    </div>

更新：
我已经调查了一点，似乎searchTerm ref，没有正确更新，即使它的边界使用v-model ...仍然不知道为什么虽然。