无法从阵列获取信息

问题描述 投票:0回答:1

```
function displayResults(responseJson) {
const gamedata = responseJson.results.map(game => {
	return {
		name: game.name,
		consoles: game.platforms,
		metacritc: game.metacritic,
		genre: game.genres
	};
});
console.log(gamedata);
inputData(gamedata);
}

function platformdata(consoles) {
return consoles.map(system => {
	return system.platform.name;
});
}

function inputData(gamedata) {
gamedata.map(input => {
	$(`#home-list`).html(`
	<h1>${input.name}</h1>
	<h5>${input.metacritc}</h5>
	<span>${input.system}</span>
	`);
});
}
```

我一直在尝试从数组中获取信息,但尚未成功获取信息。游戏平台的信息有些嵌套,我一直在尝试将其挖掘出来,但无济于事。

https://api.rawg.io/api/games?page_size=1

我可以更详细地显示信息的最佳方式是建议将上面的链接放入邮递员中,您会看到我正在尝试的内容。基本上,它位于结果>平台>平台>名称下。当我将此信息添加到map函数中时,它是不确定的。现在运行它,他们想到用逗号说对象。我希望它只提供省略逗号的信息。我不知道如何获取join()进入html()。非常感谢!

编辑:1)我想要的结果是能够在平台树中被拉起,但被掩埋了。如果我只使用game.platforms,它将产生[object,Object]。如果我尝试在游戏数据行中添加更多内容,它将产生未定义的内容。

2)在“ gamedata.map(input => {”?

3)是,我尝试根据我在网上找到的代码来创建一个辅助函数。我在网上找到的代码使用了过多的li和ul

```
function platformnames(platforms) {
return platforms.map(system => {
	return '<li>'  system.platform.name + '</li>';
});
}

function pullArray(gamedata) {
gamedata.map(function(input) {
	let platformNames = input.platforms.map(
		system => `<li>${system.platform.name}</li>`
	);
	$(`#home-container`)
		.append(`<li><ul><li>${platformNames}</li></ul></li>`)
		.join(' ');
});
}
```

此方法有效,但给出了非常奇怪的结果。

4)不,我一次将所有内容都添加到相同的ID。

5)那是我试图从API平台上挖掘信息的方法。它埋在那儿,我还没有找到一个好的解决方案。

function formatParams(params) {
    const queryItems = Object.keys(params).map(
        key => `${key}=${params[key]}`
    );
    console.log(queryItems);
    return queryItems.join('&');
}

const opts = {
    headers: {
        'User-Agent': `<ClassProject> / <VER 0.01> <Currently in Alpha testing>`
    }
};

function fetchAPI() {
    const params = {
        ...($('.search-param').val() && {
            search: $('.search-param').val()
        }),
        ...($('.genre-param').val() && {
            genres: $('.genre-param').val()
        }),
        ...($('.platforms-param').val() && {
            platforms: $('.platforms-param').val()
        }),
        ...($('.publishers-param').val() && {
            publishers: $('.publishers-param').val()
        }),
        page_size: '1'
    };

    console.log(params);

    const baseURL = 'https://api.rawg.io/api/games';
    const queryString = formatParams(params);
    let url = `${baseURL}?${queryString}`;

    console.log(url);

    fetch(`${url}`, opts)
        .then(response => response.json())
        .then(responseJson => displayResults(responseJson))
        .catch(error => {
            console.log(`Something went wrong: ${error.message}`);
        });
}

function displayResults(responseJson) {
    const gamedata = responseJson.results.map(game => {
        return {
            name: game.name,
            consoles: game.platforms,
            metacritc: game.metacritic,
            genre: game.genres
        };
    });
    console.log(gamedata);
    inputData(gamedata);
}

function inputData(gamedata) {
    let html = '';
    gamedata.forEach(input => {
        html += `<h1>${input.name}</h1>`;
        html += `<h5>Metacritic: ${input.metacritic ||
            'No metacritic rating'}</h5>`;
        html += 'Platforms:<br />';
        input.consoles.forEach(e => {
            html += `<span>${e.platform.name}</span><br />`;
        });
        html += `<br /><span>System: ${input.system}</span>`;
    });
    document.getElementById('home-list').innerHTML = html;
}

function pageLoad() {
    $(document).ready(function() {
        fetchAPI();
    });
}

pageLoad();

所以,我要感谢这里所有人的帮助。现在,我返回“ Metacritic:无metacritic评分”,或者如果我删除了该评分或部分未定义的评分。我想念什么?

javascript jquery postman api-design
1个回答
0
投票

下面的代码段为您提供平台名称。我修改/创建了

© www.soinside.com 2019 - 2024. All rights reserved.