error: attempted to update component that has already been unmounted (or failed to mount)

In your render function, you're calling this.setState({mounted:true}). From React's component documentation:

The render() function should be pure, meaning that it does not modify component state, it returns the same result each time it's invoked, and it does not directly interact with the browser.

Here's the link to the React documentation on the render function.

There is another way this error can occur...thinking that props are individual arguments (props is actually a single argument)

import React from 'react';

const Posts = posts => {       // WRONG

const Posts = ({posts}) => {   // RIGHT
  const renderPosts = () => {
    return posts.map(post => <div>{post.title}</div>);
  };

  return <div>{renderPosts()}</div>;
};

My problem is I forget

import React from 'react'

in my .jsx file, since I thought importing React is not needed in functional component.