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)
}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)
}