Svelte中bind绑定值无法用于startsWith()文本搜索过滤的问题

直接把startsWith的固定参数换成searchterm即可，但要注意两个关键细节：

• 每次搜索要重置结果数组，避免旧结果累积
• 确保searchterm的值正确传入，无需手动加引号（变量本身就是字符串类型）

修正后的完整代码：

<script>
let searchingfor = []
let searchterm = ""

const arr = ["can","can't", "also", "before", "eternal", "anothera"]

function findterm() {
    // 直接用searchterm作为startsWith参数，同时重置结果数组
    searchingfor = arr.filter(el => el.startsWith(searchterm))
    console.log("搜索结果:", searchingfor)
}
</script>

<input type="text" bind:value={searchterm} />
<button on:click={findterm}>搜索</button>

<!-- 可选：展示搜索结果 -->
{#if searchingfor.length > 0}
    <ul>
        {#each searchingfor as item}
            <li>{item}</li>
        {/each}
    </ul>
{/if}

关键修正说明： #

• 移除冗余数组操作：原代码中用push追加结果会导致多次搜索后数据累积，直接用filter的返回值覆盖searchingfor，简洁且避免数据混乱。
• 正确传入变量：searchterm通过bind:value绑定输入框值，本身就是字符串类型，直接传入startsWith即可，不需要手动添加引号。
• 可选优化：大小写不敏感搜索：如果需要忽略大小写匹配，可统一转成小写后判断：

  searchingfor = arr.filter(el => el.toLowerCase().startsWith(searchterm.toLowerCase()))
  

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