Nuestros mejores programadores han agotado sus depósitos de café, en su búsqueda día y noche por la solución, hasta que Penélope halló el resultado en Gogs así que hoy la compartimos aquí.
Solución:
El problema
Cuando tiene una unión de arreglos de diferentes tipos, no puede llamar a métodos en ellos.
La razón
Tienes string[] | number[]y entonces .filter es:
((filterFunc: (x: string) => boolean) => string[])
| ((filterFunc: (x: number) => boolean) => number[])
Cuando TS combine esas firmas, unirá las dos filterFunc firmas juntas:
((x: number) => boolean)
| ((x: string) => boolean)
Esto es un poco poco intuitivo, pero esto simplifica a (x: number & string) => boolean. Porque si tienes una función que toma X, o una función que toma Y, lo único seguro que puedes pasar es algo que es a la vez X y Yo X & Y.
number & string sin embargo, es un tipo imposible, que “simplifica” a never. Por eso la firma es (x: never) => boolean.
La solución
Idealmente, solo usaría string[] o number[] pero no ambos. (Solo mirando el código, es un poco misterioso por qué id solo puede ser un número, pero los “identificadores de productos seleccionados” también pueden ser cadenas)
Pero si necesita admitir tanto cadenas como números, la solución más fácil aquí es usar Array en vez de string[] | number[]: El soltero array type no tiene el problema de tratar de unir dos .filter firmas
Puede cambiar su estado para que sea de ese tipo:
const [selectedProductIds, setSelectedProductIds] = useState>([]);
Esto es simple, pero tiene la desventaja de que permitirá matrices de mixed cadenas y números, que pueden no ser deseables. (p.ej setSelectProductIds(['0', 1, '2'])
Si no, puedes lanzar temporalmente a Arrayhaz el filtro, luego lanza de nuevo a string[] | number[]. Esto no es súper limpio, pero debería ser seguro:
setProductPrices(
(productPrices as Array).filter((p): boolean => !selectedProductIds.includes(p.id)) as (string[] | number[])
);
Para su uso Estado en lugar de
const [selectedProductIds, setSelectedProductIds] = useState([]);
Puedes intentar
const [selectedProductIds, setSelectedProductIds] = useState< (string|number)[]>([]);
¿en lugar de?
Esto se debe a que probablemente falte algún código en el que ha configurado selectedProductIds como un array de string. Y en su código lo ha definido estrictamente como 1 array y no el otro. Tal vez el cambio anterior solucione eso. Confirma amablemente.
Sección de Reseñas y Valoraciones
Nos puedes añadir valor a nuestra información contribuyendo tu experiencia en las notas.