I am starting to learn to react with REST Countries API. I have to face the error “Uncaught TypeError: inputArgs[0].match is not a function” in console. Also, console data shows duplicate results. You can see the screenshot.

here is my code

import { useEffect, useState } from "react";
import "./App.css";

const gridStyle = {
    display: "grid",
    gridTemplateColumns: "repeat(4, 1fr)",
    gridGap: "20px",

function App() {
    return (
        <div className="App">

function Countries() {
    const [countries, setCountries] = useState([]);
    useEffect(() => {
            .then((res) => res.json())
            .then((data) => setCountries(data));
    }, []);

    return (
        <div className="all-countries">
            <div style={gridStyle} className="country-container">
                {countries.map((country) => (
                    <Country country={country}></Country>

function Country({ country }) {
    return (
        <div className="country">
            <img src={country.flags.png} alt="" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

Shamim Reza is a new contributor to this site. Take care in asking for clarification, commenting, and answering. Check out our Code of Conduct.

I got around the error by passing string as first argument.

console.log('', data)

I had a similar issue, for me the real error was in the stack trace before the one that says “Uncaught Type Error InputArgs[0].match…”

So clear the console, then run it again to get the stack trace then scroll all the way up to see the error.



The whole day I tried to fix this issue and finally realized it happened from the React dev tool So I think it will fix by the React dev tool authorizer.

i had the same problem, but it worked when i removed the console.log(variable)

Remove React Dev tool. This is the only solution i’ve discovered till now and it works.

If you check a few lines down in Uncaught TypeError message, maybe find a file name you’ve modified. for me, it was App.jsx. and i found console.log(variable) when i remove this, all clear

I am face the same problem and solved by the following way…

use useEffect to console.log(user) or console.dir(user) the user from useState

       if (user) {

its working for me, try and let me know through reply this comment

As @francis mentioned, a simple solution that adds no dependencies with using any hooks is to start by logging a string followed by your variable.

console.log("", variable_name);