Esta podría ser una simple pregunta duplicada, pero no pude encontrar ninguna solución que resuelva mi caso a continuación. ¡Por favor, ayúdame! :)
Estoy buscando un método de cadena para verificar si el valor coincide con una cadena específica y devolver ese resultado.
create-react-app y tengo un menú desplegable <select> para que los usuarios filtren platos con un rango de precios específico Actualmente estoy usando el método .includes y no obtengo el resultado que quiero porque incluye todos los resultados que contienen un carácter de la cadena. (Si los usuarios eligen " $ ", también devolverá los resultados que incluyen " $$ " y " $$$ ")
-> Solo quiero que devuelvan los resultados con exactamente el valor de las cadenas anteriores. Entonces, ¿qué usar en lugar de .includes ?
// Initial states: const [foodList, setFoodList] = useState([]) const [foodName, setFoodName] = useState('') const [isVegetarian, setIsVegetarian] = useState('') const [priceRange, setPriceRange] = useState('$') const [textSearch, setTextSearch] = useState('') const [priceDropdown, setPriceDropdown] = useState('') const [vegDropdown, setVegDropdown] = useState('') // Search.js: const newSearch = props.foodList.filter((value) => { return ( value.foodName.toLowerCase().includes(textSearch.toLowerCase()) && // What to use instead of .includes here? value.priceRange.toLowerCase().includes(priceDropdown.toLocaleLowerCase()) && value.isVegetarian.includes(vegDropdown.toLowerCase()) ) } )Parece que un === estándar será suficiente para sus necesidades, ya que no está verificando si un valor incluye la selección de filtro, sino que es exactamente la selección. (Sospecho que también querrá lo mismo en la opción isVegetarian .
const newSearch = props.foodList.filter((value) => { return ( value.foodName.toLowerCase().includes(textSearch.toLowerCase()) && value.priceRange.toLowerCase() === priceDropdown.toLocaleLowerCase() && value.isVegetarian === vegDropdown.toLowerCase() ) }); Además, como se mencionó en los comentarios, trate de mantener su ejemplo lo más mínimo posible para reproducir el problema; siempre es un equilibrio entre el contexto y la simplicidad. En este caso, sin embargo, mostrar una pequeña estructura de datos de foodList y el método newSearch (con una pequeña explicación) probablemente sería suficiente.