Custom filter function

[te-deum]

Hello,

I'd like to know if it's possible to add a property to customize the search function.
At the moment, the search is strict and the results must correspond exactly to the string entered in the search box.

What I'd like is if the user types several terms separated by spaces, then I'll search for each of the terms in the results without the position being important.

Example:
Values:
[ 'Apple', 'Apple Pie', 'Apple tea', 'Pine Apple' ]
If I search for: “ppl pi” = No results
Expected result: 'Apple Pie' + 'Pine Apple'

Here is the filter function that I would like to implement :

const onSearchChange = (search) => {
    if (!search) return props.multiselect_options; // If no search term, return all options

    // Normalizes a string to ignore accents
    const normalize = str => str.normalize("NFD").replace(/[\u0300-\u036f]/g, "");

    // Divides the search into several parts
    const queryParts = normalize(search).trim().toLowerCase().split(/\s+/);
    console.log(queryParts);

    // Filter options by individual terms
    let ret = props.multiselect_options.filter(option => {
        const normalizedOption = normalize(option.name).toLowerCase();
        return queryParts.every(part => normalizedOption.includes(part));
    });
    console.log(ret);

    return ret;
}

[mattelen]

Have you tried using the Asynchronous select features (https://vue-multiselect.js.org/#sub-asynchronous-select). This sounds like you could use that? Check it out and let us know if that does what you need it to