title: React send function as props
body: <p>I'm trying to follow a video tutorial, but one part doesn't work for me.</p>
  <p>Home.js</p>
  <pre><code>import { useState, useEffect } from 'react';
  import Bloglist from './components/Bloglist';
  
  const Home = () =&gt; {
    const [blogs, setBlogs] = useState([
      { title : 'My new website', body: 'lorem ipsum...', author: 'Mario', id: 1 },
      { title : 'Welcome party', body: 'lorem ipsum...', author: 'Yoshi', id: 2 },
      { title : 'Web dev top tips', body: 'lorem ipsum...', author: 'Mario', id: 3 }
    ]);
    
    const handleDelete = (id) =&gt; {
      const newBlogs = blogs.filter(blog =&gt; blog.id !== id);
      setBlogs(newBlogs);
    };
    
    useEffect(() =&gt; {
      console.log('use effect ran');
    });
    
    return (
      &lt;div className=&quot;home&quot;&gt;
        &lt;Bloglist blogs={blogs} title=&quot;All blogs&quot; handleDelete=&quot;{handleDelete}&quot; /&gt;
      &lt;/div&gt;
    );
  };
  
  export default Home;
  </code></pre>
  <p>Bloglist.js</p>
  <pre><code>const Bloglist = ({ blogs, title, handleDelete }) =&gt; {
    return(
      &lt;div className=&quot;blog-list&quot;&gt;
        &lt;h2&gt;{ title }&lt;/h2&gt;
        {blogs.map((blog) =&gt; (
          &lt;div className=&quot;blog-preview&quot; key={ blog.id }&gt;
            &lt;h2&gt;{ blog.title }&lt;/h2&gt;
            &lt;p&gt;Scritto da { blog.author }&lt;/p&gt;
            &lt;button onClick={() =&gt; handleDelete(blog.id)}&gt;Delete blog&lt;/button&gt;
          &lt;/div&gt;
        ))}
      &lt;/div&gt;
    );
  };
  
  export default Bloglist;
  </code></pre>
  <p>When I click on &quot;Delete blog&quot; the console says: Uncaught TypeError: handleDelete is not a function, why?</p>
  <p>If necessary and if possible I can post the link to the video tutorial</p>