Как вы используете WP REST API для отображения результатов поиска в простом Javascript?

Question

У меня есть поле поиска, в котором я хотел бы получить результаты поиска пользователя, извлекая данные из файлов JSON из API-интерфейса WP REST.Мне нужно сделать это в простом JavaScript, и я работаю в классе JavaScript для ООП.Подскажите, пожалуйста, лучший способ настроить код?

Я пробовал это в функции вызываемого метода getResults, которая находится в моем классе:

getResults() {
    var httpRequest = new XMLHttpRequest()
    httpRequest.onreadystatechange = function (results){
        alert(results.title.rendered);
    }

    httpRequest.open('GET', 'https://website.com/wp-json/wp/v2/pages/');
    httpRequest.send();
}

Однако, это дает мне ошибку «Uncaught TypeError: Cannot read property»rendered 'of undefined "

Я ссылался на этот пост, в котором показаны разные версии JQuery и Plain JS.Мне нужно использовать простой JS.https://gist.github.com/joyrexus/7307312

Результаты запроса JSON должны отображаться на странице со списком заголовков сообщений.Хотя ради этого вопроса я просто хочу, чтобы заголовки отображались в alert().

Answer 1

httpRequest.onreadystatechange имеет свойство readyState, которое устанавливается каждый раз, когда изменяется состояние запроса. Вам нужно подождать, пока readyState == 4, прежде чем заполнить ваш объект результатов.

Answer 2

Обновите свою функцию так:

function getResults() {
    var httpRequest = new XMLHttpRequest()
    httpRequest.onreadystatechange = function (){
        if (this.readyState == 4 && this.status == 200) {
         obj = JSON.parse(this.responseText);
         alert(obj.title);//if there is a title on your Json response
      }
    }

    httpRequest.open('GET', 'https://website.com/wp-json/wp/v2/pages/');
    httpRequest.send();
}