My code isn't working specifically with the country.name.match function not working as intended.
Error code is as follows: App.js:27 Uncaught TypeError: country.name.match is not a function
REST API being used: https://restcountries.com/#api-endpoints-v3-all
Rest of the code if needed:https://github.com/jnatividad-design/FSO/tree/main/part2/countries
const handleFilterSubmit = (event) => {
console.log(event.target.value)
setNewFilter(event.target.value)
const regex = new RegExp ( newFilter, 'i');
const filteredCountries = () => countries.filter(country => country.name.match(regex));
setCountries(filteredCountries)
}
CodePudding user response:
I figured out what was wrong. The REST API changed the database's structure slightly, adding more specificity to the country and its name. Originally it went country.name instead, it must be country.name.common as the name is another object with properties such as common name, official name, etc.
const handleFilterSubmit = (event) => {
console.log(event.target.value)
setNewFilter(event.target.value)
const regex = new RegExp ( newFilter, 'i');
const filteredCountries = () => countries.filter(country => country.name.common.match(regex));
setCountries(filteredCountries)
}
CodePudding user response:
It's hard to say without seeing more of the code (knowing what "countries" looks like would be helpful, for example), but my first guess would be that maybe country.name
is not a string. Have you verified that the value you're trying to call match()
on is a string?