我有一个使用javascript和vuejs框架的应用程序。我正在尝试创建一个项目的“下拉列表”,根据用户类型进行过滤。
以下是如何在页面上呈现列表的代码:
<div>
<v-list v-for="item in userInputedFormulas" :key="item.id" >
<v-list-item>
<v-list-item-title>
{{ item.name }} {{ item.structure }}
</v-list-item-title>
</v-list-item>
</v-list>
</div>
以下是如何生成UserInputFormulas的方法:
userInputedFormulas() {
this.userInput.forEach(element => {
if(this.allFormulas?.filter(formula => formula.name.includes(element.toLowerCase()))) {
filteredList = this.allFormulas?.filter(
formula => formula.name.includes(this.userInput)
);
} if(this.userInput == this.allFormulas?.filter(formula => formula.name)) {
filteredList = this.allFormulas?.filter(formula => formula.name = this.userInput)
}
});
return filteredList;
}
请注意,allformulas基本上返回所有公式的对象数组,例如:[{name:'sum',structure:'blah'},{name:'add',structure:'blah'},{name:'minus',structure:'blah'}]
从某种意义上说,它可以在用户键入时过滤“公式”列表,就像这样:
但是,当用户键入字符(-round-opening-方括号)时,我希望对其进行过滤,使其仅显示精确的公式。
例如,用户类型为“sum”(“sum”),则与上面显示名称中包含“sum”的所有项目的图片不同,它应该只显示“sum”项目。由于我不确定如何进一步,我如何才能过滤此内容?
2条答案
按热度按时间dy2hfwbg1#
您不能将搜索查询与正则表达式匹配吗?如果有一个圆括号,您可以将功能从数组筛选切换到只查找正确的一个?
bvpmtnay2#
我可以看到两种选择:
选项a:我假设您的正则表达式如下(简化):
^(TERM)/gm
. 如果用户输入(
您可以将正则表达式更改为^(TERM)$/gm
用美元符号替换括号,迫使正则表达式评估整个术语,而不仅仅是部分术语。选项b:更干净的方法是为每个结果项定义一个正则表达式,并使用此特定正则表达式来计算搜索项,例如,对于sum函数,类似这样的方法:
^SUM(\(([\d,\s]+\))?)?/gm
(免责声明:我不是正则表达式Maven)