m0_59080281 2021-08-24 15:36 采纳率: 81.8%
浏览 414
已结题

我想把提交的表单内容localStorage到本地缓存应该如何实现

img
点击提交,提交上去内容

img
rod是下方表格内的数据
score是上方输入框里选择的数据
如何使用localStorage把这两个数据缓存到本地

  • 写回答

4条回答 默认 最新

  • 在下月亮有何贵干 前端领域优质创作者 2021-08-24 15:50
    关注

    localstorage,如何使用呢,其实很简单,无论什么开发语言vue还是react都逃不开写js吧,js里面有个window用过吧,localstorage就在上面,然后他有两个方法,一个setItem一个getItem,一个设置值一个取值,window.localstorage.setItem("key","value"),现在我们就把一个value值存在浏览器里了,然后只要用window.localstorage.getItem("key"),你就拿到一个值叫做"value"了,然后一般保存的时候我们都是保存对象而不是单独的值,而本地缓存只能保存字符串,所以我们要把对象用JSON.stringify()把对象改成字符串保存,然后取值的时候用JSON.parse()转回来,为什么我们要用它,因为它可以保存在你的浏览器作为记录,你关闭浏览器重新打开对应的页面,也可以获取到这个值,不需要网络。

    
    <!DOCTYPE html>
    <html lang="en">
     
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <style>
     
    </style>
     
    <body>
     
    </body>
     
    <script>
     
        window.localStorage.setItem('name', 'D-bzq')
     
    </script>
     
    </html>
    

    然后你打开浏览器就会看到

    img

    然后再重写代码,重新关闭浏览器再打开试试

    <!DOCTYPE html>
    <html lang="en">
     
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <style>
     
    </style>
     
    <body>
     
    </body>
     
    <script>
     
        const name = window.localStorage.getItem('name')
        alert(name)
    </script>
     
    </html>
    
    

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

问题事件

  • 系统已结题 9月1日
  • 已采纳回答 8月24日
  • 创建了问题 8月24日

悬赏问题

  • ¥20 Apache poi使用问题
  • ¥21 matlab怎么求时域信号的二阶导数
  • ¥15 判断两个表是否完全相同
  • ¥15 java map类型数据格式,如何快速通过前缀匹配元素
  • ¥15 stc12c5a60s2、QMC5883L、LCD1602组合测量磁场所需程序
  • ¥20 Win11测试yolov4,“找不到nvcuda.dll”怎么办?
  • ¥15 simulink绘制bode图
  • ¥15 php_network_getaddresses: getaddrinfo failed: Name or service not known
  • ¥15 用msg发消息出现的问题
  • ¥15 unity3d机械臂