React.js this2.setState不是函数吗？

Question

我正在尝试从pokemon api检索pokemon数据，我的问题是渲染状态。我得到TypeError: _this2.setState is not a function，但不确定为什么。我应该在componentDidMount函数之外进行此访存调用吗？我是一个反应的新手，只是想学习。

import ReactDOM from "react-dom";
import styled from "styled-components";

import "./styles.css";

class App extends Component {
  state = {
    allPokemon: []
  };

  componentDidMount() {
    let images = [];
    async function fetchPokeMonData() {
      const response = await fetch("https://pokeapi.co/api/v2/pokemon");
      const data = await response.json();
      return await Promise.all(
        data.results.map(async pokemon => {
          const response = await fetch(pokemon.url);
          const pokemonData = await response.json();

          console.log(
            pokemonData.id,
            pokemonData.name,
            pokemonData.sprites.front_default
          );
          this.setState({
            allPokemon: {
              id: pokemonData.id,
              name: pokemonData.name,
              sprite: pokemonData.sprites.front_default
            }
          });

          return images;
        })
      ).catch(err => {
        console.error(err);
      });
    }
    fetchPokeMonData();
  }

  render() {
    return <StyledApp>{console.log(this.images)}</StyledApp>;
  }
}

const StyledApp = styled.div`
  height: 100vh;

  background: linear-gradient(
    to right,
    #8e9eab,
    #eef2f3
  ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

  padding: 30px;
`;

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

我在https://codesandbox.io/s/w6momrq41k

的codeandbox网址中进行了此设置

先谢谢您。