如何在Vuejs / Javascript中使过滤器不区分大小写

时间:2017-06-07 06:07:10

标签: javascript vue.js vuejs2 vue-filter

我正在尝试在Vuejs 2中构建一个应用程序,我正在使用过滤器来查找元素数组中的特定数据。此过滤器为case sensitive,但我希望case insensitive,以下是我的代码:

tableFilter: function () {
    if( this.model ) {
        return this.model.filter( 
            item =>
                item.clients_association.includes( this.search_by_name ) && 
                item.event_type.includes( this.search_by_event_type )
            )
            .map(
                d => (
                    {
                        id: d.id,
                        client_names: d.clients_association,
                        stellar_participants: d.stellar_participants,
                        contact_participants: d.contacts_association,
                    }
                )
            );
    }
}

请指导我如何实现它。

1 个答案:

答案 0 :(得分:3)

由于Array#includescase sensitive,您可以将所有内容转换为小写:

const searchTerm = this.search_by_name.toLowerCase();
const searchEvent = this.search_by_event_type.toLowerCase();

this.model.filter((item) =>
  item.clients_association.toLowerCase().includes(searchTerm) &&
  item.event_type.toLowerCase().includes(searchEvent)
);

您也可以使用String#test,它接受​​带有insensitive(i)标志的正则表达式,如果字符串与表达式匹配则返回true,否则返回false

const searchTerm = new RegExp(this.search_by_name, 'i');
const searchEvent = new RegExp(this.search_by_event_type, 'i');

this.model.filter((item) =>
  searchTerm.test(item.clients_association) &&
  searchEvent.test(item.event_type)
);