Javascript:如何使用提取从数组中输出某些信息?

时间:2019-09-16 16:27:55

标签: javascript rest fetch

所以我正在做一个Java技术练习,并且我几乎已经完成了它,我试图从API URL输出数据并将其显示在我的html页面上。

我基本上拥有了我想要的一切,但是我无法显示来自Keep What You WantstepNumber的api标题。

我只需要stepNumber 3来显示Keep What You Want而不是Keep What You Like

如何使用当前代码执行此操作?

JavaScript

fetch('https://uqnzta2geb.execute-api.us-east-1.amazonaws.com/default/FrontEndCodeChallenge')
    .then(function (response) {
        return response.json();
    })
    .then(function (data) {
        appendData(data);
    })
    .catch(function (err) {
        console.log('This is an error', err);
    });

function appendData(data) {
    let mainContainer = document.getElementById("testdata");
    let titleContainer = document.getElementById("testdata");
    let bodyContainer = document.getElementById("testdata");


    data
    .filter(item => ["1", "2", "3", "4"].includes(item.stepNumber))
    .sort((a, b) => +a.stepNumber - b.stepNumber)
    .forEach(({id, stepNumber, versionContent}) => {
        const div = document.createElement("div");
        const divTwo = document.createElement("span");
        const divThree = document.createElement("p");

        const {title, body} = versionContent.slice().pop();

        div.innerHTML = stepNumber;
        divTwo.innerHTML = versionContent[0].title;
        divThree.innerHTML = body;


        mainContainer.appendChild(div);
        titleContainer.appendChild(divTwo);
        bodyContainer.appendChild(divThree);
    });

}

0 个答案:

没有答案