right

// state обновляется корректно и функция map() отрабатывает верно!
class Recipes extends Component {
  state = {
    recipes: [],
  };

  componentDidMount() {
    this.getData().then(res => {
      this.setState({recipes: res})
    });
  }

  getData() {
    const url = '/api/v1/recipes/index';
    const recipes = fetch(url)
      .then(response => response.json())
      .catch(error => console.log(error));
    return recipes;
  }

  render() {
    const { recipes } = this.state;

    // !!! map() работает

    const allRecipes = recipes.map((recipe, index) => (
      <ul key={index}>
        <li>{recipe.id}</li>
      </ul>
    );
    return (
      <div>{allRecipes}</div>
    )
  }
}