I want to change the item names of my search filters in the front end and I found that when using:
<ais-refinement-list [..] :transform-items="transformItems" />
</ais-refinement-list>
I can then redefine the lists labels in a method (Algolia docs):
transformItems: function(items) {
return items.map(item => ({
...item,
label: item.label.toLowerCase(),
}));
},
But what I need to do is rename all of the 6 filters/facets for the front end and I figured I need to do that with several if() statements. But how do I do that in this map()-method? For example how can I rename the item with label 'MC' to 'Multiple Choice'? I tried just writing
transformItems: function(items) {
return items.map(item => ({
...item,
if(item.label == 'MC'){
label: 'Multiple Choice',
}else{
label: item.label,
}
}));
},
But that failed spectacularly. What's the correct way to solve this?
There surely is a better way but I solved it by outsourcing the if condition into another method called "rename(item.label)" where I give the changed label as return value and in the map() function I just say "label: rename(item.label),".
map function:
transformItems: function(items) {
return items.map(item => ({
...item,
label: this.rename(item.label),
}));
},
new rename method:
rename : function(label){
// Rename MC to Multiple Choice
if(label === 'MC'){
label = 'Multiple Choice'
}
[..] //other renaming if conditions
return label
},