Question

我创建了一个网站，其工作方式类似于游戏清单。您可以使用gameContainer()功能添加游戏。

const gameContainer = (iconPath: string, name: string, version: string) => {
    const img = document.createElement("img")
    const gameName = document.createElement("a")
    const gameVersion = document.createElement("p")
    const root = document.getElementById("root")
    const gameDiv = document.createElement("DIV")

    root.appendChild(gameDiv)

    img.src = iconPath
    img.className = "gameIcon"
    gameName.innerHTML = name
    gameVersion.innerHTML = version
    
    gameDiv.className = "gameDiv"
    gameDiv.appendChild(img)
    gameDiv.appendChild(gameName)
    gameDiv.appendChild(gameVersion)
}

现在，问题在于，如果刷新页面，添加的所有游戏都会消失。如何在浏览器中保存这些更改？

如果您需要有关网站的更多信息，我将网站的源代码上传到GitHub：https://github.com/Zockedidock/show-games

Answer 1

根据您的情况，您只需修改html页面以显示您的数据

您可以看看here

localStorage.setItem("myGames", JSON.stringify(yourGameList));

将保存您的视频游戏列表

console.log(JSON.parse(localStorage.getItem("myGames")));

将打印保存的列表

这意味着您将必须将视频游戏的列表存储在一个列表中，并提供一个显示该列表的功能

在浏览器中保存更改

1 个答案: