我有一个包含一些公司数据的对象数组。我已经根据用户是否选择了成员类型来过滤数据,然后我想通过公司名称进一步过滤数据。例如,如果用户输入Google将匹配的公司“ Go”或“ go”,则这必须是部分匹配。目前,我已经对其进行了设置,因此仅会匹配全名“ Google”。
这是我的代码:
https://jsfiddle.net/reece_dev/h3z2rxen/3/
<database name="mydb">
<table name="scc_import">
<column name="ItemId">000053</column>
<column name="ItemName">Grüne Olivenpaste Arbequina</column>
<column name="TaxCode">WDR</column>
... all other fields ...
</table>
... all other nodes ...
</database>
const data = [
{
"company_name":"HP",
"member_type":"Full"
},
{
"company_name":"Microsoft",
"member_type":"Full"
},
{
"company_name":"Slack",
"member_type":"Market Practitioner "
},
{
"company_name":"Figma",
"member_type":"Supplier"
},
{
"company_name":"Google",
"member_type":"Market Practitioner"
},
{
"company_name":"Fyber",
"member_type":"Full"
},
{
"company_name":"Crunchyroll",
"member_type":"Full"
},
{
"company_name":"Sony",
"member_type":"Supplier"
},
{
"company_name":"Netflix",
"member_type":"Supplier"
},
{
"company_name":"Facebook",
"member_type":"Supplier"
},
{
"company_name":"Instagram",
"member_type":"Market Practitioner"
}
];
var app = new Vue({
el: '#member_dir_search',
data: {
rawCompanies: data,
companyType: '',
searchString: '',
},
computed: {
companies: function() {
// if memberTypes is set filter the raw data by membership type
if ( this.companyType !== '') {
let filteredMembers = this.rawCompanies.filter(company => {
return company.member_type === this.companyType
});
if (this.searchString.length > 1 ) {
filteredMembers = filteredMembers.filter(company => {
return company.company_name === this.searchString
});
}
return filteredMembers;
}else {
return this.rawCompanies;
}
}
},
methods: {
setCompanyType(type) {
// if the selected type is already selected unset companyType else set companyType
if (type === this.companyType) {
this.companyType = '';
} else {
this.companyType = type;
}
},
companySearch() {
// if string is at lease two characters long minus white space
if (this.searchString.length > 1 ) {
console.log(this.searchString);
}
}
}
});
答案 0 :(得分:2)
例如,如果用户输入“ Go”或 “去” Google将匹配的公司。
然后,您必须使用toLowerCase()
规范化数据并使用includes
let filteredMembers = this.rawCompanies.filter(company => {
return company.member_type.toLowerCase().includes(this.companyType.toLowerCase())
});
if (this.searchString.length > 1 ) {
filteredMembers = filteredMembers.filter(company => {
return company.company_name.toLowerCase().includes(this.searchString.toLowerCase())
});
}