Búsqueda de sitios web

reactjs - React y Fuse js con TypeScript


Tengo este mensaje de error al usar Typescript con Fuse.js

TS2345: El argumento de tipo '{ keys: string; }' no se puede asignar al parámetro de tipo 'FuseOptions<{ 'ISBN': string; 'title': string; 'author': string; }>'. Los tipos de la propiedad 'keys' son incompatibles. El tipo 'string' no se puede asignar al tipo '("title" | "ISBN" | "author")[] | { name: "title" | "ISBN" | "author"; weight: number; }[]'.

Aquí está el código:

let books = [{
        'ISBN': 'A',
        'title': "Old Man's War",
        'author': 'John Scalzi'
    },
    {
        'ISBN': 'B',
        'title': 'The Lock Artist',
        'author': 'Steve Hamilton'
    }
]

let options = {
    keys: 'title'
}
let fuse = new Fuse(books, options)

let filterResult = fuse.search('old')

El error ocurre al pasar el cursor sobre las opciones en let fuse=new Fuse(books, options)

Respuesta #1

Esto también me confundió un poco.

El compilador se mueve en orden de arriba a abajo, así que para cuando ha revisado options, ha inferido que es un string[], lo cual no es compatible con el keyof de tu tipo de libro. Así que agrega una anotación de tipo a tu declaración de options.

Además, las keys deben ser un arreglo de claves.

Resultado final:

type Book = { ISBN:string; title: string; author: string; };

let options: Fuse.FuseOptions<Book>  = {
    keys: ['title'],
};

Respuesta #2

Probablemente sea una mejor idea proporcionar tu tipo a tu instancia de Fuse a través de un parámetro genérico en su constructor.

Entonces, en este caso, algo como esto tipearía correctamente toda la configuración y los métodos de Fuse, no solo tu objeto options:

type Book = { ISBN: string; title: string; author: string; };

const fuse = new Fuse<Book>(books, { keys: ['title'] });

// filterResult is of type Fuse.FuseResult<Book>[]
const filterResult = fuse.search('old');

// or, if you want result of type Book[] 
const books = filterResult.map(({ item }) => item);

Artículos relacionados