0

So I have set up my Fuse.js as such:

  const fuse = useMemo(() => {
    return new Fuse<Fees>(data, {
      includeMatches: true,
      keys: [{ name: "name" }],
      ignoreLocation: true,
      useExtendedSearch: true,
      threshold: isStrictSearch ? 0 : 0.6,
    });
  }, [data, isStrictSearch]);

so basically isStrictSearch is a boolean state, which is toggled on and off. When it's toggled on (true), then I set the threshold of Fuse.js to 0. However this does not work as perfectly as I want it to be. So for example I have these cases:

DATA

const data = [
    {
        "name": "Surimi Maki Sticks - 1kg",
        ...
    },
    {
        "name": "No Worries Wild Berry Can",
        ...
    },
    ...
]

Case 1

Search query: Maki Sticks 1kg.
Result: Surimi Maki Sticks - 1kg.

This shouldn't happen because it should take - into account.

Case 2

Search query: No Worries Can.
Result: No Worries Wild Berry Can.

This also shouldn't happen because it should take Wild Berry into account.


I'm not sure how to achieve this, I have tried other combinations for the Fuse.js options, but still not able to achieve the result I want.

1
  • I know you can set the threshold to a negative number, which means that it would only give exact matches, but I think it's too strict, in a way where it has to have the whole string be typed/queried then it gives the result.
    – Owenn
    Commented Jun 1, 2023 at 3:13

1 Answer 1

1

I have decided to use another logic than using Fuse.js to handle this issue:

if (isStrictSearch) {
    const results = data.filter(function (datum) {
        return datum.name.toLowerCase().includes(query.toLowerCase());
    });
    return results;
} else {
    const results = fuse.search(query);
    return results.map((i) => i.item);
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.