I'm doing a filter of a list by name, it works, but if I have a name registered as Hi, the filter does not work when I write higor.
computed: {
filtered: function () {
const search = this.configs.search
const users = _.orderBy(this.users, this.configs.orderBy, this.configs.order)
if (_.isEmpty(search)) {
return users;
}
return _.filter(users, user => user.name.indexOf(search) >= 0)
}
}
I made a join of this response How to do a search by ignoring accent in Javascript? , to normalize the accented text (removing the accents) and also putting the values all in low case, and this resulted in a minimal example:
var vm = new Vue({
el: '#app',
data: {
title: 'Pesquisa',
items: [
{id: 1, name:'Paul Lima'},
{id: 2, name:'souza Cruz'},
{id: 3, name:'Adael cruz'},
{id: 4, name:'Pául lima'},
{id: 5, name:'Pâul cruz'},
{id: 6, name:'Sôuza Cruz'},
{id: 6, name:'Cruz adael'}
]
},
methods: {
nameFilter: function(item) {
if (!this.searchText || this.searchText === '') {
return true;
}
var n = this.prepareNameFilter(item.name);
var s = this.prepareNameFilter(this.searchText);
return n.includes(s);
},
prepareNameFilter: function replaceSpecialChars(str) {
if (!str) return '';
str = str.toLowerCase();
str = str.replace(/[aáàãäâ]/,'a');
str = str.replace(/[eéèëê]/,'e');
str = str.replace(/[iíìïî]/,'i');
str = str.replace(/[oóòõöô]/,'o');
str = str.replace(/[uúùüû]/,'u');
return str;
}
}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/0.12.16/vue.min.js"></script><divid="app">
{{title}}
<br />
<input type="text" v-model="searchText"/>
<br />
<ul>
<li v-repeat="items | filterBy nameFilter">
{{id}} {{name}}
</li>
</ul>
</div>Since you did not post a minimal example of your code, it's a little tricky to reflect on what you've done, so this example can help you adapt to your code.
Thank you very much, it worked for me. It looks like this:
filtered: function () {
const search = this.configs.search
const users = _.orderBy(this.users, this.configs.orderBy, this.configs.order)
if (_.isEmpty(search)) {
return users
}
function replaceSpecialChars(str) {
if (!str) return ''
str = str.toString()
str = str.replace(/[aáàãäâ]/,'a')
str = str.replace(/[eéèëê]/,'e')
str = str.replace(/[iíìïî]/,'i')
str = str.replace(/[oóòõöô]/,'o')
str = str.replace(/[uúùüû]/,'u')
return str
}
return _.filter(users, user => replaceSpecialChars(user.name.toLowerCase()).indexOf(search.toLowerCase()) >= 0)
}