Как использовать php rest api с реагировать?

Question

Я хочу создать внешний интерфейс, используя реагирование для моего PHP rest API. Я пытаюсь прочитать данные из остальных API, но мне не удается получить их правильно. Я проверил все запросы в Почтальоне, и они отлично работают, но я понятия не имею, почему они не реагируют.

Я пытался сделать это с помощью axios / fetch / get, но всегда получаю одну и ту же ошибку TypeError: items.map не является функцией. Должен ли я переписать мой API отдыха? Мой API возвращает JSON, и я не знаю, нужно ли мне его декодировать в реакции?

Мой php код:

public function read() {
    // Create query
    $query = 'SELECT * FROM ' . $this->table ;

    // Prepare statement
    $stmt = $this->conn->prepare($query);

    // Execute query
    $stmt->execute();

    return $stmt;
}

API readUM.php

<?php
// Headers
header('Access-Control-Allow-Origin: *');
header('Content-Type: application/json');
include_once '../../config/Database.php';
include_once '../../models/Post2.php';
// Instantiate DB & connect
$database = new Database();
$db = $database->connect();
// Instantiate  post object
$post = new Post2($db);
// Blog post query
$result = $post->read();
// Get row count
$num = $result->rowCount();
// Check if any posts
if ($num > 0) {
// Post array
$posts_arr = array();
 $posts_arr['data'] = array();
while ($row = $result->fetch(PDO::FETCH_ASSOC)) {
    extract($row);
    $post_item = array(
        'id' => $id,
        'name' => $name,
        'location' => $location,
        'type' => $type,
        'logo' => $logo
    );
    // Push to "data"
    //array_push($posts_arr, $post_item);
    array_push($posts_arr['data'], $post_item);
}
// Turn to JSON & output
echo json_encode($posts_arr);
} else {
// No Posts
echo json_encode(
    array('message' => 'No Posts Found')
);
}

Результат у почтальона:

{
"data": [
    {
        "id": "1",
        "name": "Test",
        "location": "Cluj",
        "type": "Test",
        "logo": null
    }
]
}

Мой код реакции:

 constructor(props) {
    super(props);
    this.state = {
        items: [],
        isLoaded: false,
    }
}

componentDidMount() {

    fetch('http://localhost/fak/api/post/readUM.php')
        .then(res => res.json())
        .then(json => {
            this.setState({
                isLoaded: true,
                items: json,
            })
        });
}

render() {

    let {isLoaded, items} = this.state;

    if (!isLoaded) {
        return <div>Loading...</div>
    } else {
        return (
            <div className="App ">
                <ul>
                    {items.map(item => (
                        <li key={item.id}>
                            Name:  {item.name} | Location:{item.location} 
                        </li>
                    ))};
                </ul>
            </div>
        );
    }
    }
}

console.log (JSON):

Object
data: Array(1)
0: {id: "1", name: "Test", location: "Cluj", type: "Test", logo: null}
length: 1
__proto__: Array(0)
__proto__: Object